SlideShare uma empresa Scribd logo
1 de 88
Baixar para ler offline
@webinterface
HASSLIEBE ONLINE FORMULARE
ENHANCE YOUR FORM
FOR BETTER UX
WEBTECHCON 2016, MÜNCHEN
@webinterface
PETER ROZEK
@webinterface
@webinterface
@webinterface
WORK @ ecx.io (DIGITAL AGENCY)
@webinterface
Hassliebe Onlineformulare, Enhance your Form for better UX
UX, USABILITY, ACCESSIBILITY,
FRONTEND
@webinterface
@webinterface
THE WEB FORM IS THE
PRIMARY MECHANISM
FOR COLLECTING
PERSONAL
INFORMATION.
@webinterface
CONTACT FORM
FEEDBACK FORM
REGISTRATION
LOGIN
COMMUNICATION
…
EVERY USER INTERFACE
IS A CONVERSATION.
@webinterface
WE HAVE THE SAME
PROBLEM WITH FORM.
@webinterface
UNBEARABLE
Hassliebe Onlineformulare, Enhance your Form for better UX
@webinterface
@webinterface
@webinterface
NOT USABLE
@webinterface
@webinterface
NOT UNDERSTANDABLE
@webinterface@webinterface
FRUSTRATING
@webinterface
SMART AND LESS UI
@webinterface
@webinterface
Hassliebe Onlineformulare, Enhance your Form for better UX
@webinterface
USER RESEARCH:

INVESTIGATING HOW
AND WHY HUMANS DO
WHAT THEY DO.
@webinterface
CREATING PERSONAS
CHARACTERISTICS OF A GOOD PERSONA
BUSINESS CASES FOR PERSONAS
THE VALUE OF PERSONAS
USING PERSONAS THOUGHOUT THE DESIGN PROCESS
@webinterface
USER JOURNEY MAP
@webinterface
MULTISCREEN 

DAYFLOW
@webinterface
WE CAN EASILY PROGRESSIVELY
ENHANCE OUR FORM WITH HTML 5.
@webinterface
VISUAL DESIGN:
STRUCTURING VISUAL
ELEMENTS.
@webinterface
VERTICAL NOT
HORIZONTAL
LABEL
LABEL
@webinterface
PRINCIPLES OF PERCEPTION:
PROXIMITY SIMILARITY CLOSURE
@webinterface Source: http://www.lukew.com/ff/entry.asp?1502
@webinterface Source: http://www.lukew.com/ff/entry.asp?1502
@webinterface Source: http://www.lukew.com/ff/entry.asp?1502
@webinterface
PORTRAIT VS LANDSCAPE
@webinterface
INTERACTION DESIGN:
OPTIMIZING THE
INTERPLAY BETWEEN
HUMANS AND
INTERFACES.
@webinterface
DONT´T USE ASTERIKS,
MAKE CLEAR OPTIONAL
FIELDS.
@webinterface
E-MAIL *
NAME *
PHONE NUMBER
JOB TITLE *
MARKING 

FIEDS 

AS 

REQUIRED
?
MARKING 

FIEDS 

AS 

OPTIONAL
E-MAIL
NAME
PHONE NUMBER (OPTIONAL)
JOB TITLE
VS
@webinterface
LABEL WHAT´S OPTIONAL, 

GET MORE INPUT.
Source: http://research.microsoft.com/en-us/projects/webforms/
@webinterface
IT´S MORE ACCESSIBILITY.
@webinterface
USE MAGIC
@webinterface
PHONE NUMBER (OPTIONAL)
Example: 0151 111222333 <input type="tel" placeholder=„Example..“>
PHONE NUMBER (OPTIONAL)
<input type="text">
@webinterface Source: http://caniuse.com/#feat=input-placeholder
INPUT PLACEHOLDER ATTRIBUTE
@webinterface
USE SINGLE FIELD FOR
NUMBERS OR POSTCODE.
@webinterface
@webinterface
@webinterface
ALLOW INPUT IN VARIOUS FORMS.
@webinterface
USE A GOOD SYSTEM VALIDATION
AND PROVIDE CLEAR ERROR
MESSAGES.
@webinterface
USE MAGIC
@webinterface
<input type=“tel“>
PHONE NUMBER
039
TELEPHONE INPUT TYPES
@webinterface Source: http://caniuse.com/#feat=input-email-tel-url
@webinterface Source: http://quirksmode.org/html5/inputs/mobile.html
type=“tel“
@webinterface
TO OFFER INPUT
ASSISTANCE.
@webinterface
<input type=“email“>
E-MAIL
peter.rozek@ecx.io
<input type=“url“>
URL
www.
EMAIL. TELEPHONE AND URL INPUT TYPES
@webinterface Source: http://caniuse.com/#feat=input-email-tel-url
@webinterface
REAL TIME FEEDBACK
@webinterface Source: http://alistapart.com/article/inline-validation-in-web-forms
@webinterface Source: http://alistapart.com/article/inline-validation-in-web-forms
@webinterface
REAL TIME FEEDBACK IS USEFUL TO
PRESENT INFORMATION THAT NEEDS
TO BE CONVEYEND URGENTLY AND
REUIRES USER´S INSTANT
ATTENTION.
@webinterface
USABILITY:
INVESTIGATING HOW
HUMANS USE THE THINKS
WE BUILD.
@webinterface
HTML 5 FORM
VALIDATION WITH REGEX
@webinterface
EMAIL
peter.rozek@ecx.io
<input type=“email“><input type="email" pattern="[^ @]*@[^ @]*" required>
@webinterface
PASSWORD
<input type="password" pattern="(?=.*d)(?=.*[a-z])(?=.*[A-Z]).{8,}"
required>
@webinterface
PHONE NUMBER
<input type="phone" pattern="(+?d[- .]*){7,13}" required>
PATTERN ATTRIBUTE FOR INPUT FIELDS
@webinterface Source: http://caniuse.com/#feat=input-pattern
@webinterface
COMBINE REQUIRED, PATTERN AND
CSS PSEUDO-CLASSES.
@webinterface
LABEL (:valid)
LABEL (:required)
LABEL (:invalid)
input:required {
border: 1px solid blue;
}
input:valid {
border: 1px solid green;
}
input:invalid {
border: 1px solid red;
}
:invalid, :valid, and :required 

CSS PSEUDO-CLASSES
@webinterface Source: http://caniuse.com/#feat=form-validation
@webinterface
PLACE TIPS AT THE SIDE
OF THE RELEVANT
FIELDS.
@webinterface
@webinterface
CONFIRM PASSWORD
FIELD MUST DIE.
EXCLUDING IT IS NOT ENOUGH
SHOW PASSWORD TOGGLE
@webinterface Source: http://uxmovement.com/
@webinterface
@webinterface Source: http://uxmovement.com/
@webinterface
Password:
<input type="password" id="test1" value="a" />
<input id="test2" type="checkbox" /> Show password
PASSWORD
SHOW PASSWORD
@webinterface
//Place this plugin snippet into another file in your applicationb
(function ($) {
$.toggleShowPassword = function (options) {
var settings = $.extend({
field: "#password",
control: "#toggle_show_password",
}, options);
var control = $(settings.control);
var field = $(settings.field)
control.bind('click', function () {
if (control.is(':checked')) {
field.attr('type', 'text');
} else {
field.attr('type', 'password');
}
})
};
}(jQuery));
//Here how to call above plugin from everywhere in your application document body
$.toggleShowPassword({
field: '#test1',
control: '#test2'
});
@webinterface
WHAT ABOUT OLDER
BROWSERS?
@webinterface
THE H5F LIBRARY,
EMULATE THE HTML5
FORMS CHAPTER.
https://github.com/ryanseddon/H5F
@webinterface
CONCLUSION
@webinterface
UNDERSTANDING THE
CONTEXT.
@webinterface
YOUR COMMUNICATION
HAPPENS BETWEEN
DEVICES.
@webinterface
DESIGNING FOR DEVICE
ORIENTATION.
@webinterface
INCLUDE ONLY THE
IMPORTANT DETAILS IN
YOUR FORM.
@webinterface
LESS USER INTERFACE
@webinterface
SMART FORM
@webinterface
SMART FORM INCREASE
YOUR CONVERSION RATE.
@webinterface
DONT´T
UNDERESTIMATE THE
POWER OF HTML.
THANKS
…dear Ellen
@webinterface
@webinterface
peter.rozek@ecx.io

Mais conteúdo relacionado

Mais procurados

Principles of microservices XP Days Ukraine
Principles of microservices   XP Days UkrainePrinciples of microservices   XP Days Ukraine
Principles of microservices XP Days UkraineSam Newman
 
Of innovation and impatience - Future Decoded 2015
Of innovation and impatience - Future Decoded 2015Of innovation and impatience - Future Decoded 2015
Of innovation and impatience - Future Decoded 2015Christian Heilmann
 
Practical microservices - javazone 2014
Practical microservices -  javazone 2014Practical microservices -  javazone 2014
Practical microservices - javazone 2014Sam Newman
 
Responsive webdesign
Responsive webdesignResponsive webdesign
Responsive webdesignBart De Waele
 
Is SharePoint Still Right for You?
Is SharePoint Still Right for You?Is SharePoint Still Right for You?
Is SharePoint Still Right for You?ShareGate
 
Future of Collaboration with SharePoint & Office 365
Future of Collaboration with SharePoint & Office 365Future of Collaboration with SharePoint & Office 365
Future of Collaboration with SharePoint & Office 365ShareGate
 
Testing & deploying microservices - XP Days Ukraine 2014
Testing & deploying microservices  - XP Days Ukraine 2014Testing & deploying microservices  - XP Days Ukraine 2014
Testing & deploying microservices - XP Days Ukraine 2014Sam Newman
 
Codemotion Progressive Web Applications Pwa Webinar - Jorge Ferreiro - @jgfer...
Codemotion Progressive Web Applications Pwa Webinar - Jorge Ferreiro - @jgfer...Codemotion Progressive Web Applications Pwa Webinar - Jorge Ferreiro - @jgfer...
Codemotion Progressive Web Applications Pwa Webinar - Jorge Ferreiro - @jgfer...Jorge Ferreiro
 
10 technische SEO Hacks | Dominik Wojcik | SEOkomm 2017
10 technische SEO Hacks | Dominik Wojcik | SEOkomm 201710 technische SEO Hacks | Dominik Wojcik | SEOkomm 2017
10 technische SEO Hacks | Dominik Wojcik | SEOkomm 2017TA Trust Agents Internet GmbH
 
Jensimmons html5live-responsivedesign
Jensimmons html5live-responsivedesignJensimmons html5live-responsivedesign
Jensimmons html5live-responsivedesignJen Simmons
 
How To Be an HTML5 Mobile Cloud Champion
How To Be an HTML5 Mobile Cloud ChampionHow To Be an HTML5 Mobile Cloud Champion
How To Be an HTML5 Mobile Cloud ChampionChris Love
 
Make mobile web apps rock
Make mobile web apps rockMake mobile web apps rock
Make mobile web apps rockChris Love
 
Progressive Web Apps - Goto Chicago 2017
Progressive Web Apps - Goto Chicago 2017Progressive Web Apps - Goto Chicago 2017
Progressive Web Apps - Goto Chicago 2017Christian Heilmann
 
The Progressive Web and its New Challenges - Confoo Montréal 2017
The Progressive Web and its New Challenges - Confoo Montréal 2017The Progressive Web and its New Challenges - Confoo Montréal 2017
The Progressive Web and its New Challenges - Confoo Montréal 2017Christian Heilmann
 
Mobile Apps at Work for Non For Profit Accountants #AICPANFP
Mobile Apps at Work for Non For Profit Accountants #AICPANFPMobile Apps at Work for Non For Profit Accountants #AICPANFP
Mobile Apps at Work for Non For Profit Accountants #AICPANFPgrimesba
 
Mobile apps at work for non for profit accountants aicpa
Mobile apps at work for non for profit accountants aicpaMobile apps at work for non for profit accountants aicpa
Mobile apps at work for non for profit accountants aicpaAbila
 
Pantalk: Responsive Web Design
Pantalk: Responsive Web DesignPantalk: Responsive Web Design
Pantalk: Responsive Web DesignScreen Concept
 

Mais procurados (20)

Principles of microservices XP Days Ukraine
Principles of microservices   XP Days UkrainePrinciples of microservices   XP Days Ukraine
Principles of microservices XP Days Ukraine
 
Of innovation and impatience - Future Decoded 2015
Of innovation and impatience - Future Decoded 2015Of innovation and impatience - Future Decoded 2015
Of innovation and impatience - Future Decoded 2015
 
Smart Design
Smart Design Smart Design
Smart Design
 
It's a trap!
It's a trap!It's a trap!
It's a trap!
 
Practical microservices - javazone 2014
Practical microservices -  javazone 2014Practical microservices -  javazone 2014
Practical microservices - javazone 2014
 
Responsive webdesign
Responsive webdesignResponsive webdesign
Responsive webdesign
 
Is SharePoint Still Right for You?
Is SharePoint Still Right for You?Is SharePoint Still Right for You?
Is SharePoint Still Right for You?
 
Future of Collaboration with SharePoint & Office 365
Future of Collaboration with SharePoint & Office 365Future of Collaboration with SharePoint & Office 365
Future of Collaboration with SharePoint & Office 365
 
Testing & deploying microservices - XP Days Ukraine 2014
Testing & deploying microservices  - XP Days Ukraine 2014Testing & deploying microservices  - XP Days Ukraine 2014
Testing & deploying microservices - XP Days Ukraine 2014
 
Codemotion Progressive Web Applications Pwa Webinar - Jorge Ferreiro - @jgfer...
Codemotion Progressive Web Applications Pwa Webinar - Jorge Ferreiro - @jgfer...Codemotion Progressive Web Applications Pwa Webinar - Jorge Ferreiro - @jgfer...
Codemotion Progressive Web Applications Pwa Webinar - Jorge Ferreiro - @jgfer...
 
10 technische SEO Hacks | Dominik Wojcik | SEOkomm 2017
10 technische SEO Hacks | Dominik Wojcik | SEOkomm 201710 technische SEO Hacks | Dominik Wojcik | SEOkomm 2017
10 technische SEO Hacks | Dominik Wojcik | SEOkomm 2017
 
Jensimmons html5live-responsivedesign
Jensimmons html5live-responsivedesignJensimmons html5live-responsivedesign
Jensimmons html5live-responsivedesign
 
How To Be an HTML5 Mobile Cloud Champion
How To Be an HTML5 Mobile Cloud ChampionHow To Be an HTML5 Mobile Cloud Champion
How To Be an HTML5 Mobile Cloud Champion
 
Make mobile web apps rock
Make mobile web apps rockMake mobile web apps rock
Make mobile web apps rock
 
Progressive Web Apps - Goto Chicago 2017
Progressive Web Apps - Goto Chicago 2017Progressive Web Apps - Goto Chicago 2017
Progressive Web Apps - Goto Chicago 2017
 
The Progressive Web and its New Challenges - Confoo Montréal 2017
The Progressive Web and its New Challenges - Confoo Montréal 2017The Progressive Web and its New Challenges - Confoo Montréal 2017
The Progressive Web and its New Challenges - Confoo Montréal 2017
 
Mobile Apps at Work for Non For Profit Accountants #AICPANFP
Mobile Apps at Work for Non For Profit Accountants #AICPANFPMobile Apps at Work for Non For Profit Accountants #AICPANFP
Mobile Apps at Work for Non For Profit Accountants #AICPANFP
 
Mobile apps at work for non for profit accountants aicpa
Mobile apps at work for non for profit accountants aicpaMobile apps at work for non for profit accountants aicpa
Mobile apps at work for non for profit accountants aicpa
 
The modern PWA Cheat Sheet
The modern PWA Cheat SheetThe modern PWA Cheat Sheet
The modern PWA Cheat Sheet
 
Pantalk: Responsive Web Design
Pantalk: Responsive Web DesignPantalk: Responsive Web Design
Pantalk: Responsive Web Design
 

Semelhante a Hassliebe Onlineformulare, Enhance your Form for better UX

DESIGN THE PRIORITY, PERFORMANCE 
AND UX
DESIGN THE PRIORITY, PERFORMANCE 
AND UXDESIGN THE PRIORITY, PERFORMANCE 
AND UX
DESIGN THE PRIORITY, PERFORMANCE 
AND UXPeter Rozek
 
Zooz - Finding the perfect Roommate! [Slideshow]
Zooz - Finding the perfect Roommate! [Slideshow]Zooz - Finding the perfect Roommate! [Slideshow]
Zooz - Finding the perfect Roommate! [Slideshow]Sami Mnassri
 
Running SharePoint on Small Business Server: Pros and Cons - 100 Level
Running SharePoint on Small Business Server: Pros and Cons - 100 LevelRunning SharePoint on Small Business Server: Pros and Cons - 100 Level
Running SharePoint on Small Business Server: Pros and Cons - 100 LevelRobert Crane
 
Why Nobody Fills Out My Forms 2 - Electric Boogalo
Why Nobody Fills Out My Forms 2 - Electric BoogaloWhy Nobody Fills Out My Forms 2 - Electric Boogalo
Why Nobody Fills Out My Forms 2 - Electric BoogaloAndrew Malek
 
Responsive Navigation Patterns, UX and Guidelines
Responsive Navigation Patterns, UX and GuidelinesResponsive Navigation Patterns, UX and Guidelines
Responsive Navigation Patterns, UX and GuidelinesPeter Rozek
 
Sencha and Spring (Spring 2GX 2013)
Sencha and Spring (Spring 2GX 2013) Sencha and Spring (Spring 2GX 2013)
Sencha and Spring (Spring 2GX 2013) Sencha
 
Petr Dvořák: Mobilní webové služby pohledem iPhone developera
Petr Dvořák: Mobilní webové služby pohledem iPhone developeraPetr Dvořák: Mobilní webové služby pohledem iPhone developera
Petr Dvořák: Mobilní webové služby pohledem iPhone developeraWebExpo
 
Why Nobody Fills Out My Forms 2 - Electric Boogalo (Updated)
Why Nobody Fills Out My Forms 2 - Electric Boogalo (Updated)Why Nobody Fills Out My Forms 2 - Electric Boogalo (Updated)
Why Nobody Fills Out My Forms 2 - Electric Boogalo (Updated)Andrew Malek
 
E-commrce page.docx
E-commrce page.docxE-commrce page.docx
E-commrce page.docxAmitmAHI4
 
Presentation from SMBNation Spring 2011
Presentation from SMBNation Spring 2011Presentation from SMBNation Spring 2011
Presentation from SMBNation Spring 2011Robert Crane
 
The Internet as Web Services: introduction to ReST
The Internet as Web Services: introduction to ReSTThe Internet as Web Services: introduction to ReST
The Internet as Web Services: introduction to ReSTBruno Kessler Foundation
 
Online Hotel Management
Online Hotel ManagementOnline Hotel Management
Online Hotel ManagementSouvik Banik
 
Eslam soliman moursy hassan senior softwaredeveloper
Eslam soliman moursy hassan senior softwaredeveloperEslam soliman moursy hassan senior softwaredeveloper
Eslam soliman moursy hassan senior softwaredevelopereslam_Adam2000
 
What if everything is awesome? Codemotion Madrid 2014
What if everything is awesome? Codemotion Madrid 2014What if everything is awesome? Codemotion Madrid 2014
What if everything is awesome? Codemotion Madrid 2014Christian Heilmann
 
ICONUK 2016: REST Assured, Freeing Your Domino Data Has Never Been That Easy!
ICONUK 2016: REST Assured, Freeing Your Domino Data Has Never Been That Easy!ICONUK 2016: REST Assured, Freeing Your Domino Data Has Never Been That Easy!
ICONUK 2016: REST Assured, Freeing Your Domino Data Has Never Been That Easy!Serdar Basegmez
 
Taking Your Small Business Mobile - 101
Taking Your Small Business Mobile - 101Taking Your Small Business Mobile - 101
Taking Your Small Business Mobile - 101Wayne Sutton
 

Semelhante a Hassliebe Onlineformulare, Enhance your Form for better UX (20)

DESIGN THE PRIORITY, PERFORMANCE 
AND UX
DESIGN THE PRIORITY, PERFORMANCE 
AND UXDESIGN THE PRIORITY, PERFORMANCE 
AND UX
DESIGN THE PRIORITY, PERFORMANCE 
AND UX
 
Zooz - Finding the perfect Roommate! [Slideshow]
Zooz - Finding the perfect Roommate! [Slideshow]Zooz - Finding the perfect Roommate! [Slideshow]
Zooz - Finding the perfect Roommate! [Slideshow]
 
Running SharePoint on Small Business Server: Pros and Cons - 100 Level
Running SharePoint on Small Business Server: Pros and Cons - 100 LevelRunning SharePoint on Small Business Server: Pros and Cons - 100 Level
Running SharePoint on Small Business Server: Pros and Cons - 100 Level
 
Why Nobody Fills Out My Forms 2 - Electric Boogalo
Why Nobody Fills Out My Forms 2 - Electric BoogaloWhy Nobody Fills Out My Forms 2 - Electric Boogalo
Why Nobody Fills Out My Forms 2 - Electric Boogalo
 
Responsive Navigation Patterns, UX and Guidelines
Responsive Navigation Patterns, UX and GuidelinesResponsive Navigation Patterns, UX and Guidelines
Responsive Navigation Patterns, UX and Guidelines
 
Sencha and Spring (Spring 2GX 2013)
Sencha and Spring (Spring 2GX 2013) Sencha and Spring (Spring 2GX 2013)
Sencha and Spring (Spring 2GX 2013)
 
Petr Dvořák: Mobilní webové služby pohledem iPhone developera
Petr Dvořák: Mobilní webové služby pohledem iPhone developeraPetr Dvořák: Mobilní webové služby pohledem iPhone developera
Petr Dvořák: Mobilní webové služby pohledem iPhone developera
 
- Webexpo 2010
- Webexpo 2010- Webexpo 2010
- Webexpo 2010
 
Why Nobody Fills Out My Forms 2 - Electric Boogalo (Updated)
Why Nobody Fills Out My Forms 2 - Electric Boogalo (Updated)Why Nobody Fills Out My Forms 2 - Electric Boogalo (Updated)
Why Nobody Fills Out My Forms 2 - Electric Boogalo (Updated)
 
E-commrce page.docx
E-commrce page.docxE-commrce page.docx
E-commrce page.docx
 
Mkp resume.docx
Mkp resume.docxMkp resume.docx
Mkp resume.docx
 
Presentation from SMBNation Spring 2011
Presentation from SMBNation Spring 2011Presentation from SMBNation Spring 2011
Presentation from SMBNation Spring 2011
 
Resume
ResumeResume
Resume
 
The Internet as Web Services: introduction to ReST
The Internet as Web Services: introduction to ReSTThe Internet as Web Services: introduction to ReST
The Internet as Web Services: introduction to ReST
 
Online Hotel Management
Online Hotel ManagementOnline Hotel Management
Online Hotel Management
 
Eslam soliman moursy hassan senior softwaredeveloper
Eslam soliman moursy hassan senior softwaredeveloperEslam soliman moursy hassan senior softwaredeveloper
Eslam soliman moursy hassan senior softwaredeveloper
 
Niket bhatt
Niket bhattNiket bhatt
Niket bhatt
 
What if everything is awesome? Codemotion Madrid 2014
What if everything is awesome? Codemotion Madrid 2014What if everything is awesome? Codemotion Madrid 2014
What if everything is awesome? Codemotion Madrid 2014
 
ICONUK 2016: REST Assured, Freeing Your Domino Data Has Never Been That Easy!
ICONUK 2016: REST Assured, Freeing Your Domino Data Has Never Been That Easy!ICONUK 2016: REST Assured, Freeing Your Domino Data Has Never Been That Easy!
ICONUK 2016: REST Assured, Freeing Your Domino Data Has Never Been That Easy!
 
Taking Your Small Business Mobile - 101
Taking Your Small Business Mobile - 101Taking Your Small Business Mobile - 101
Taking Your Small Business Mobile - 101
 

Mais de Peter Rozek

How to win Stakeholders, Design needs Leadership
How to win Stakeholders, Design needs Leadership How to win Stakeholders, Design needs Leadership
How to win Stakeholders, Design needs Leadership Peter Rozek
 
Persona driven agile development
Persona driven agile developmentPersona driven agile development
Persona driven agile developmentPeter Rozek
 
Cross Device Experience with HTML Prototyping
Cross Device Experience with HTML PrototypingCross Device Experience with HTML Prototyping
Cross Device Experience with HTML PrototypingPeter Rozek
 
Create User Centric UI-Animations
Create User Centric UI-AnimationsCreate User Centric UI-Animations
Create User Centric UI-AnimationsPeter Rozek
 
Responsive Experience und das Continuum of Screens
Responsive Experience und das Continuum of ScreensResponsive Experience und das Continuum of Screens
Responsive Experience und das Continuum of ScreensPeter Rozek
 
Responsive Content Experience
Responsive Content ExperienceResponsive Content Experience
Responsive Content ExperiencePeter Rozek
 
Device Agnostic: Geräteunabhängiges Design als UX Grundlage
Device Agnostic: Geräteunabhängiges Design als UX GrundlageDevice Agnostic: Geräteunabhängiges Design als UX Grundlage
Device Agnostic: Geräteunabhängiges Design als UX GrundlagePeter Rozek
 
Search Experience Optimization, Nutzerfokus statt Silodenken
Search Experience Optimization, Nutzerfokus statt SilodenkenSearch Experience Optimization, Nutzerfokus statt Silodenken
Search Experience Optimization, Nutzerfokus statt SilodenkenPeter Rozek
 
Performance and UX
Performance and UXPerformance and UX
Performance and UXPeter Rozek
 
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignPeter Rozek
 
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignPeter Rozek
 
Responsive Navigation Patterns, UX und Guidelines (Webdeveloper Week 2015)
Responsive Navigation Patterns, UX und Guidelines (Webdeveloper Week 2015)Responsive Navigation Patterns, UX und Guidelines (Webdeveloper Week 2015)
Responsive Navigation Patterns, UX und Guidelines (Webdeveloper Week 2015)Peter Rozek
 
Online / Offline
Online / OfflineOnline / Offline
Online / OfflinePeter Rozek
 
Responsive Navigation Patterns, UX und Guidelines (Webinale 2015)
Responsive Navigation Patterns, UX und Guidelines (Webinale 2015)Responsive Navigation Patterns, UX und Guidelines (Webinale 2015)
Responsive Navigation Patterns, UX und Guidelines (Webinale 2015)Peter Rozek
 
Responsive Navigation Patterns, UX und Guidelines
Responsive Navigation Patterns, UX und GuidelinesResponsive Navigation Patterns, UX und Guidelines
Responsive Navigation Patterns, UX und GuidelinesPeter Rozek
 
Hightway to Hell - Responsive Webdesign Testen
Hightway to Hell - Responsive Webdesign TestenHightway to Hell - Responsive Webdesign Testen
Hightway to Hell - Responsive Webdesign TestenPeter Rozek
 
Responsive Navigation Patterns - UX und Guidelines
Responsive Navigation Patterns - UX und GuidelinesResponsive Navigation Patterns - UX und Guidelines
Responsive Navigation Patterns - UX und GuidelinesPeter Rozek
 
Responsive Workflow, Break the rules or die
Responsive Workflow, Break the rules or dieResponsive Workflow, Break the rules or die
Responsive Workflow, Break the rules or diePeter Rozek
 
Responsive Webdesign: Neue Möglichkeiten und Freiheiten mit dem CSS3-Flexbox-...
Responsive Webdesign: Neue Möglichkeiten und Freiheiten mit dem CSS3-Flexbox-...Responsive Webdesign: Neue Möglichkeiten und Freiheiten mit dem CSS3-Flexbox-...
Responsive Webdesign: Neue Möglichkeiten und Freiheiten mit dem CSS3-Flexbox-...Peter Rozek
 
Responsive Webdesign: Prozess, Dialog, Qualität
Responsive Webdesign: Prozess, Dialog, QualitätResponsive Webdesign: Prozess, Dialog, Qualität
Responsive Webdesign: Prozess, Dialog, QualitätPeter Rozek
 

Mais de Peter Rozek (20)

How to win Stakeholders, Design needs Leadership
How to win Stakeholders, Design needs Leadership How to win Stakeholders, Design needs Leadership
How to win Stakeholders, Design needs Leadership
 
Persona driven agile development
Persona driven agile developmentPersona driven agile development
Persona driven agile development
 
Cross Device Experience with HTML Prototyping
Cross Device Experience with HTML PrototypingCross Device Experience with HTML Prototyping
Cross Device Experience with HTML Prototyping
 
Create User Centric UI-Animations
Create User Centric UI-AnimationsCreate User Centric UI-Animations
Create User Centric UI-Animations
 
Responsive Experience und das Continuum of Screens
Responsive Experience und das Continuum of ScreensResponsive Experience und das Continuum of Screens
Responsive Experience und das Continuum of Screens
 
Responsive Content Experience
Responsive Content ExperienceResponsive Content Experience
Responsive Content Experience
 
Device Agnostic: Geräteunabhängiges Design als UX Grundlage
Device Agnostic: Geräteunabhängiges Design als UX GrundlageDevice Agnostic: Geräteunabhängiges Design als UX Grundlage
Device Agnostic: Geräteunabhängiges Design als UX Grundlage
 
Search Experience Optimization, Nutzerfokus statt Silodenken
Search Experience Optimization, Nutzerfokus statt SilodenkenSearch Experience Optimization, Nutzerfokus statt Silodenken
Search Experience Optimization, Nutzerfokus statt Silodenken
 
Performance and UX
Performance and UXPerformance and UX
Performance and UX
 
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
 
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
 
Responsive Navigation Patterns, UX und Guidelines (Webdeveloper Week 2015)
Responsive Navigation Patterns, UX und Guidelines (Webdeveloper Week 2015)Responsive Navigation Patterns, UX und Guidelines (Webdeveloper Week 2015)
Responsive Navigation Patterns, UX und Guidelines (Webdeveloper Week 2015)
 
Online / Offline
Online / OfflineOnline / Offline
Online / Offline
 
Responsive Navigation Patterns, UX und Guidelines (Webinale 2015)
Responsive Navigation Patterns, UX und Guidelines (Webinale 2015)Responsive Navigation Patterns, UX und Guidelines (Webinale 2015)
Responsive Navigation Patterns, UX und Guidelines (Webinale 2015)
 
Responsive Navigation Patterns, UX und Guidelines
Responsive Navigation Patterns, UX und GuidelinesResponsive Navigation Patterns, UX und Guidelines
Responsive Navigation Patterns, UX und Guidelines
 
Hightway to Hell - Responsive Webdesign Testen
Hightway to Hell - Responsive Webdesign TestenHightway to Hell - Responsive Webdesign Testen
Hightway to Hell - Responsive Webdesign Testen
 
Responsive Navigation Patterns - UX und Guidelines
Responsive Navigation Patterns - UX und GuidelinesResponsive Navigation Patterns - UX und Guidelines
Responsive Navigation Patterns - UX und Guidelines
 
Responsive Workflow, Break the rules or die
Responsive Workflow, Break the rules or dieResponsive Workflow, Break the rules or die
Responsive Workflow, Break the rules or die
 
Responsive Webdesign: Neue Möglichkeiten und Freiheiten mit dem CSS3-Flexbox-...
Responsive Webdesign: Neue Möglichkeiten und Freiheiten mit dem CSS3-Flexbox-...Responsive Webdesign: Neue Möglichkeiten und Freiheiten mit dem CSS3-Flexbox-...
Responsive Webdesign: Neue Möglichkeiten und Freiheiten mit dem CSS3-Flexbox-...
 
Responsive Webdesign: Prozess, Dialog, Qualität
Responsive Webdesign: Prozess, Dialog, QualitätResponsive Webdesign: Prozess, Dialog, Qualität
Responsive Webdesign: Prozess, Dialog, Qualität
 

Último

Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...Pranav Subramanian
 

Último (20)

Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
 

Hassliebe Onlineformulare, Enhance your Form for better UX