Web Design & Development Trends Presentation

User Centered Approach To Website Design Richard Bowden RB Consulting 25th May 2009 RB Consulting Engineers Ireland

What are we going to talk about…  Business case for web based solutions  Principles of web development  Tools for web design  A user centered approach to web development  Agile development as an approach  Technology – open or proprietary RB Consulting Engineers Ireland

Web Applications–The Business Case  Are you on Twitter, Facebook, LinkedIn etc ?  How do I know if I’m doing the right thing?  Balanced Business Scorecard  Financial,  Customer,  Internal Process  Staff objectives  Measurable kpi’s RB Consulting Engineers Ireland

Design Principles  Usability  Usefulness  Accessibility RB Consulting Engineers Ireland

So…Usability….  Usability is all about ease of use  Krug’s principle of ‘don’t make me think’  Visual design – professional and inviting RB Consulting Engineers Ireland

Key usability principles  Where am I  Finding information easily as a visitor browses  Visitor feedback in case of a wrong turn  Navigation – what’s clickable or not  How do I get to the content I want – site maps  Navigation links alter according to context – login screen RB Consulting Engineers Ireland

Additional usability principles  Consistent use of navigation aids – use of icons / positioning of links  Forms – requesting information that makes the visitor uncomfortable  Forms – clear indication on what information is required  Forms appropriate use of checkboxes, radio buttons & drop-down lists RB Consulting Engineers Ireland

Usability on Amazon RB Consulting Engineers Ireland

Usability on confused.com RB Consulting Engineers Ireland

Principles of usefulness  Relevance of information & content  Access to information – to register or not ?  Writing for the web requires a unique style  Content management process  Readability  Font size and type  Colour contrast for text  Balance of white space and content RB Consulting Engineers Ireland

Accessibility design guidelines  Be consistent throughout  Enhance clarity with good design  Do not convey information with colour alone  Create contrast between foreground and background  Avoid any unnecessary animation  Use multimedia with care  Create flexible width design  Avoid frames & pop-up windows RB Consulting Engineers Ireland

Accessibility developer guidelines  Use code validation tools  WAVE (Web Accessibility Evaluation tool)  Directory of validation tools - http://www.w3.org/WAI/ER/tools/complete  Avoid using images to display text / Use of alt text  Spacing and grouping in forms  Error prevention & recovery assistance RB Consulting Engineers Ireland

WCAG 2.0  2.0 release in December 2008  4 principles of POUR  61 checkpoints across 12 guidelines  3 categories  Popular pointers on content  Developers of authoring & evaluation tools  User related for browsers and assistive technology  Technology independent  Move away from focus on html  Objectively testable  Support for developers RB Consulting Engineers Ireland

Tools for the design process  Storyboarding  Persona analysis  Wireframes RB Consulting Engineers Ireland

Storyboarding – Key steps  Illustrations, images, mockups !  Visualise how the website will look and flow  Steps  Collate information – text and images  Sort into topics – starting with the broadest !  For each page – determine title, headings, & content  Plan the information structure & navigation approach  Layout your menu structure and page template  Then place yourself in the user’s shoes and review RB Consulting Engineers Ireland

Sample storyboard Source: d11.org RB Consulting Engineers Ireland

Persona Analysis  Distinct set of behaviours personalised – bios, pictures & names  Data drawn from user testing, observations & web traffic analysis  Don’t confuse with job roles, user roles & actual people  Helps to focus on  Key requirements  Specific needs of your users  User behaviour& goals RB Consulting Engineers Ireland

Wireframes Source: totheweb.com RB Consulting Engineers Ireland

User Centred Design – Key Questions  What is the user attempting to accomplish?  Specific tasks and goals in their work  What information does the user require from the website to progress their work?  What’s the format that they would prefer to work with?  What set of features does the user require from this website?  What are the user’s expectations about how the website will work?  Given the user’s profile in terms of skills and experience, how can a website better assist the user? RB Consulting Engineers Ireland

User Centred Design – Key steps  Involve a sample set of users  Representative in terms of skills & experience  Identify the requirements via a set of representative tasks  Progress the design and development of the website  Follow-up work after the rollout  Content management  Visitor analysis  Website performance RB Consulting Engineers Ireland

Benefits of an agile development approach  A challenge to identify all requirements upfront  Prioritise requirements into short iterations  Greater sense of progress and flexibility to adapt  Borrow aspects of Scrum and Extreme Programming approaches RB Consulting Engineers Ireland

Technology – Open or Proprietary ? Best to focus on open standards RB Consulting Engineers Ireland

In Summary….  Overall rule….It depends (Steve Krug)  Build in usability and accessibility from the start  Retain flexibility to adapt RB Consulting Engineers Ireland

Questions & Comments  Email: rb@rbconsulting.ie  Twitter: @rbconsulting  Website: www.rbconsulting.ie RB Consulting Engineers Ireland

Web Design & Development Trends Presentation

by Richard Bowden

Accessibility

Categories

Upload Details

Usage Rights

2 Embeds 7

Statistics

Web Design & Development Trends Presentation Presentation Transcript

http://www.slideshare.net	6
http://www.lmodules.com	1