SlideShare a Scribd company logo
1 of 48
Designing E-commerce User Interfaces Lawrence Najjar [email_address] Presented at the Usability Professionals Association – Austin meeting on November 13, 2003. Based on a chapter to be published in the “Handbook of Human Factors in Web Design”
Outline ,[object Object],[object Object],[object Object]
Why is E-commerce Important? ,[object Object],[object Object],[object Object],[object Object]
Why Worry about E-commerce Usability? ,[object Object],[object Object],[object Object]
Why Improve Usability? ,[object Object],[object Object],[object Object],[object Object],[object Object]
E-commerce Design Process ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Use Cases
Site Diagram
Page Format ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Navigation ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Navigation (continued) ,[object Object],[object Object],[object Object],[object Object]
Catalog ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Registration ,[object Object],[object Object],[object Object],[object Object],[object Object]
Checkout ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Checkout (continued) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Checkout (continued) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Accessibility ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
<a href=&quot;#main&quot;><img alt=&quot;Skip to main content&quot; height=&quot;1&quot; width=&quot;1&quot; border=&quot;0&quot; src=&quot;//www.ibm.com/i/c.gif&quot;/></a> . . . <a name=&quot;main&quot;><!--Main Content--></a> . . .
Internationalization ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Conclusion ,[object Object],[object Object],[object Object],[object Object]
References ,[object Object],[object Object],[object Object],[object Object],[object Object]
References ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
References ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
References ,[object Object],[object Object],[object Object],[object Object],[object Object]
References ,[object Object],[object Object],[object Object],[object Object],[object Object]
References ,[object Object],[object Object]

More Related Content

Viewers also liked

Intro e commerce
Intro e commerceIntro e commerce
Intro e commerce
Sartaj
 
1st know the features & functions of information systems
1st know the features & functions of information systems1st know the features & functions of information systems
1st know the features & functions of information systems
Bronte666
 
Unit 8 assignment 1
Unit 8   assignment 1Unit 8   assignment 1
Unit 8 assignment 1
KingHarribo
 
Benefits of e commerce 1st assignment
Benefits of e commerce 1st assignmentBenefits of e commerce 1st assignment
Benefits of e commerce 1st assignment
bradfenney94
 
08 e commerce entities
08 e commerce entities08 e commerce entities
08 e commerce entities
Rebecca Jones
 
Unit 11-systems-analysis-and-design
Unit 11-systems-analysis-and-designUnit 11-systems-analysis-and-design
Unit 11-systems-analysis-and-design
Zile Mafantiri
 
Form, Line, Plane, Space, Texture & Color
Form, Line, Plane, Space, Texture & ColorForm, Line, Plane, Space, Texture & Color
Form, Line, Plane, Space, Texture & Color
tanyalangford
 

Viewers also liked (20)

E commerce use case documentation.
E commerce use case documentation.E commerce use case documentation.
E commerce use case documentation.
 
Onlineshopping
OnlineshoppingOnlineshopping
Onlineshopping
 
On-line book store presentation
On-line book store presentation On-line book store presentation
On-line book store presentation
 
Interface usability-adding-schweppervescence-ver3-8
Interface usability-adding-schweppervescence-ver3-8Interface usability-adding-schweppervescence-ver3-8
Interface usability-adding-schweppervescence-ver3-8
 
Signing Up To Tumblr
Signing Up To TumblrSigning Up To Tumblr
Signing Up To Tumblr
 
Intro e commerce
Intro e commerceIntro e commerce
Intro e commerce
 
1st know the features & functions of information systems
1st know the features & functions of information systems1st know the features & functions of information systems
1st know the features & functions of information systems
 
Unit 8 assignment 1
Unit 8   assignment 1Unit 8   assignment 1
Unit 8 assignment 1
 
03 analysis of_requirementsspecification
03 analysis of_requirementsspecification03 analysis of_requirementsspecification
03 analysis of_requirementsspecification
 
Software development lifecycle
Software development lifecycleSoftware development lifecycle
Software development lifecycle
 
E commerce
E commerceE commerce
E commerce
 
Benefits of e commerce 1st assignment
Benefits of e commerce 1st assignmentBenefits of e commerce 1st assignment
Benefits of e commerce 1st assignment
 
08 e commerce entities
08 e commerce entities08 e commerce entities
08 e commerce entities
 
Non functional requirements. do we really care…?
Non functional requirements. do we really care…?Non functional requirements. do we really care…?
Non functional requirements. do we really care…?
 
Unit 11-systems-analysis-and-design
Unit 11-systems-analysis-and-designUnit 11-systems-analysis-and-design
Unit 11-systems-analysis-and-design
 
E commerce ( system analysis ) chapter 4
E commerce ( system analysis ) chapter 4E commerce ( system analysis ) chapter 4
E commerce ( system analysis ) chapter 4
 
Form, Line, Plane, Space, Texture & Color
Form, Line, Plane, Space, Texture & ColorForm, Line, Plane, Space, Texture & Color
Form, Line, Plane, Space, Texture & Color
 
Ppt on ONLINE BOOK STORE
Ppt on ONLINE BOOK STOREPpt on ONLINE BOOK STORE
Ppt on ONLINE BOOK STORE
 
Mobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best PracticesMobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best Practices
 
HCI 3e - Ch 9: Evaluation techniques
HCI 3e - Ch 9:  Evaluation techniquesHCI 3e - Ch 9:  Evaluation techniques
HCI 3e - Ch 9: Evaluation techniques
 

Similar to Designing e-commerce user interfaces

5. ergonomic of www interface
5. ergonomic of www interface5. ergonomic of www interface
5. ergonomic of www interface
Kh Ravy
 
A usability evaluation framework for b2 c e commerce websites
A usability evaluation framework for b2 c e commerce websitesA usability evaluation framework for b2 c e commerce websites
A usability evaluation framework for b2 c e commerce websites
Alexander Decker
 
A usability evaluation framework for b2 c e commerce websites
A usability evaluation framework for b2 c e commerce websitesA usability evaluation framework for b2 c e commerce websites
A usability evaluation framework for b2 c e commerce websites
Alexander Decker
 
BAQMaR - Conference DM
BAQMaR - Conference DMBAQMaR - Conference DM
BAQMaR - Conference DM
BAQMaR
 

Similar to Designing e-commerce user interfaces (20)

5. ergonomic of www interface
5. ergonomic of www interface5. ergonomic of www interface
5. ergonomic of www interface
 
User interface design for the Web Engineering Psychology
User interface design for the Web Engineering PsychologyUser interface design for the Web Engineering Psychology
User interface design for the Web Engineering Psychology
 
Juxt Web Connect Online Snapshot
Juxt Web Connect Online SnapshotJuxt Web Connect Online Snapshot
Juxt Web Connect Online Snapshot
 
ecom.ppt
ecom.pptecom.ppt
ecom.ppt
 
A usability evaluation framework for b2 c e commerce websites
A usability evaluation framework for b2 c e commerce websitesA usability evaluation framework for b2 c e commerce websites
A usability evaluation framework for b2 c e commerce websites
 
A usability evaluation framework for b2 c e commerce websites
A usability evaluation framework for b2 c e commerce websitesA usability evaluation framework for b2 c e commerce websites
A usability evaluation framework for b2 c e commerce websites
 
Ps13
Ps13Ps13
Ps13
 
operations management
operations managementoperations management
operations management
 
Lesson 3 Introduction to Human Computer Interaction.pptx
Lesson 3 Introduction to Human Computer Interaction.pptxLesson 3 Introduction to Human Computer Interaction.pptx
Lesson 3 Introduction to Human Computer Interaction.pptx
 
13 si(systems analysis and design )
13 si(systems analysis and design )13 si(systems analysis and design )
13 si(systems analysis and design )
 
Creative Design Process and Best Practices
Creative Design Process and Best PracticesCreative Design Process and Best Practices
Creative Design Process and Best Practices
 
BAQMaR - Conference DM
BAQMaR - Conference DMBAQMaR - Conference DM
BAQMaR - Conference DM
 
Information Architecture for Drupal
Information Architecture for DrupalInformation Architecture for Drupal
Information Architecture for Drupal
 
What is Information Architecture?
What is Information Architecture?What is Information Architecture?
What is Information Architecture?
 
Usability awareness brown bag
Usability awareness brown bagUsability awareness brown bag
Usability awareness brown bag
 
ch10.ppt
ch10.pptch10.ppt
ch10.ppt
 
Website sociability and flexibility in relation to customer online satisfaction
Website sociability and flexibility in relation to customer online satisfactionWebsite sociability and flexibility in relation to customer online satisfaction
Website sociability and flexibility in relation to customer online satisfaction
 
Ch12
Ch12Ch12
Ch12
 
Embedded User Assistance Best Practices, Scott DeLoach, ClickStart
Embedded User Assistance Best Practices, Scott DeLoach, ClickStartEmbedded User Assistance Best Practices, Scott DeLoach, ClickStart
Embedded User Assistance Best Practices, Scott DeLoach, ClickStart
 
Validations
ValidationsValidations
Validations
 

Recently uploaded

CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
giselly40
 

Recently uploaded (20)

Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 

Designing e-commerce user interfaces

  • 1. Designing E-commerce User Interfaces Lawrence Najjar [email_address] Presented at the Usability Professionals Association – Austin meeting on November 13, 2003. Based on a chapter to be published in the “Handbook of Human Factors in Web Design”
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38. <a href=&quot;#main&quot;><img alt=&quot;Skip to main content&quot; height=&quot;1&quot; width=&quot;1&quot; border=&quot;0&quot; src=&quot;//www.ibm.com/i/c.gif&quot;/></a> . . . <a name=&quot;main&quot;><!--Main Content--></a> . . .
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.

Editor's Notes

  1. Because it is growing
  2. Because bad design costs money
  3. Because good design makes money
  4. I’m going to tell you about a design process that is very good for e-commerce It is based on a business strategy and is driven by the needs of the users. And includes iterative design. Work from high to low-level design. Business strategy – Define objective for site (generate revenue, drive customers to brick-and-mortar store). Define how your site will be different from competing sites. Users – Who do you want to use the site? Why do they want to use the site? Their objectives? Their computers, display resolutions, browsers, connection speeds. What are the users’ needs? Functional requirements – Identify the functions that users want on the site. Use focus groups, interviews, contextual observations of people buying online, competitive assessments. Since you can’t include in the first phase all the functions that you identify, prioritize the functions using criteria like value to the user, differentiation from competitors, ease of implementation. “Registration” is an example of a functional requirement. Design spec – Since you iterated the design based on feedback from users and clients, programmers should be able to do their work right the first time. Very efficient. Great for morale.
  5. To refine the design and get feedback, build an interactive mockup. Show how the site works, not how it looks. Don’t show graphics because they distract reviewers and take too long to create and change. Figure out how the site works, then use the visual design to support the interaction design. Show fake data. Don’t connect to real databases. Do not reuse the code. The purpose is to change the design quickly, easily, and cheaply.
  6. 73% of Americans use modem (Harris Interactive, 2003)