SlideShare a Scribd company logo
1 of 30
Interaction design do’s & don’ts harish sivaramakrishnan computer scientist & evangelist Adobe Systems
experience matters!
Interaction design The 5 demandments.
beautiful
fast & agile
expressive
accessible
everywhere!
Flexibility is key.
RIA !=Jazzy (?)
Don’t take users for granted. Incorrect: I know my users, they will eventually come to terms with my UI / UX
Workflow is not the only King! Incorrect: Interaction design *only* if I have time.
HTML has Pages RIA’s Don’t! Hence, If your interaction design means page migration. Press the panic button. Now!
Animations are nice. Only when relevant. Don’t re-invent skip intros
bad design and programming are technology agnostic.
exhibit A for bad design and programming are technology agnostic. http://bouncebargainrentals.com/
exhibit B for bad design and programming are technology agnostic. http://www.html5zombo.com/
DO: Make a design that concurs to the demandments DON’T Rehash your existing design with a new technology.
DO: Keep in mind the multiple form factors your app needs to work on. DON’T Build hard wired layouts, whenever you can.
DO: Small devices need larger clickable areas. Design your controls for that. DON’T Hard port your Web UI to small devices, it’s a different screen, different metaphor.
DO: Give haptic feedback, wherever necessary DON’T Do random things in the name of haptic feedback
DO: Use your creative freedom keeping your end user in mind.  DON’T Invent knee-jerk patterns.
DO: Maintain the identity of a control while creating experiences around it.  DON’T Make buttons look like rockets and scroll bars look like UFOs.
DO: More in one place. Use the states metaphor.  DON’T Make an app that looks like a  <frameset>, that’s oh! So 90s!
let’s fix our part first. before we blame the technology.
let’s differentiate between “can” and “should”.
let’s differentiate between “want” and “need”.
While making technology choices, let’s not take sides. remember, their battle is not our battle.
questions?
email: hsivaram@adobe.com twitter: @hsivaramweb: http://blog.flexgeek.in

More Related Content

What's hot

Sculpting Text: Easing the Pain of Designing in the Browser
Sculpting Text: Easing the Pain of Designing in the BrowserSculpting Text: Easing the Pain of Designing in the Browser
Sculpting Text: Easing the Pain of Designing in the BrowserStephen Hay
 
4 most common mobile app development and design mistakes
4 most common mobile app development and design mistakes4 most common mobile app development and design mistakes
4 most common mobile app development and design mistakesCooperative Computing
 
6 Things to Think About Before Building Your Website
6 Things to Think About Before Building Your Website6 Things to Think About Before Building Your Website
6 Things to Think About Before Building Your WebsiteFloown
 
Lean prototyping for entrepreneurs
Lean prototyping for entrepreneursLean prototyping for entrepreneurs
Lean prototyping for entrepreneursAmir Khella
 
Continuous Design and Delivery
Continuous Design and Delivery Continuous Design and Delivery
Continuous Design and Delivery Thoughtworks
 
Top 15 Start up Questions in Web design field
Top 15 Start up Questionsin Web design fieldTop 15 Start up Questionsin Web design field
Top 15 Start up Questions in Web design fieldAlsayed Sabry
 
The Designer’s Guide to Creating Churn
The Designer’s Guide to Creating ChurnThe Designer’s Guide to Creating Churn
The Designer’s Guide to Creating ChurnJohn Need
 
Gappsy Review - Create faster and Amazing apps for IOS and Android
Gappsy Review - Create faster and Amazing apps for IOS and AndroidGappsy Review - Create faster and Amazing apps for IOS and Android
Gappsy Review - Create faster and Amazing apps for IOS and AndroidRavi Prakash Singh
 
Collaborating Effectively with Developers
Collaborating Effectively with DevelopersCollaborating Effectively with Developers
Collaborating Effectively with DevelopersJayde Ly
 
Delivering Content via Mobile
Delivering Content via Mobile Delivering Content via Mobile
Delivering Content via Mobile Adam Fellowes
 
Creating an Interactive Book with iBooks Author #mLearnCon15
Creating an Interactive Book with iBooks Author #mLearnCon15Creating an Interactive Book with iBooks Author #mLearnCon15
Creating an Interactive Book with iBooks Author #mLearnCon15Nick Floro
 
How to write compelling user stories
How to write compelling user storiesHow to write compelling user stories
How to write compelling user storiesBalaji Rajagopalan
 
Prototyping invision vs axure
Prototyping invision vs axurePrototyping invision vs axure
Prototyping invision vs axureAndrii Rusakov
 
Digital summit denver creating customer experience design
Digital summit denver   creating customer experience designDigital summit denver   creating customer experience design
Digital summit denver creating customer experience designCody Landefeld
 
Web Design Assessment
Web Design AssessmentWeb Design Assessment
Web Design Assessmentdarrenmcilroy
 
How to Improve Mobile Business (SqueezeMobillionaire)
How to Improve Mobile Business (SqueezeMobillionaire)How to Improve Mobile Business (SqueezeMobillionaire)
How to Improve Mobile Business (SqueezeMobillionaire)Squeeze Mobi
 
Build Key UI Elements in High Fidelity
Build Key UI Elements in High FidelityBuild Key UI Elements in High Fidelity
Build Key UI Elements in High FidelitySV.CO
 

What's hot (19)

Sculpting Text: Easing the Pain of Designing in the Browser
Sculpting Text: Easing the Pain of Designing in the BrowserSculpting Text: Easing the Pain of Designing in the Browser
Sculpting Text: Easing the Pain of Designing in the Browser
 
4 most common mobile app development and design mistakes
4 most common mobile app development and design mistakes4 most common mobile app development and design mistakes
4 most common mobile app development and design mistakes
 
6 Things to Think About Before Building Your Website
6 Things to Think About Before Building Your Website6 Things to Think About Before Building Your Website
6 Things to Think About Before Building Your Website
 
Lean prototyping for entrepreneurs
Lean prototyping for entrepreneursLean prototyping for entrepreneurs
Lean prototyping for entrepreneurs
 
Continuous Design and Delivery
Continuous Design and Delivery Continuous Design and Delivery
Continuous Design and Delivery
 
Top 15 Start up Questions in Web design field
Top 15 Start up Questionsin Web design fieldTop 15 Start up Questionsin Web design field
Top 15 Start up Questions in Web design field
 
The Designer’s Guide to Creating Churn
The Designer’s Guide to Creating ChurnThe Designer’s Guide to Creating Churn
The Designer’s Guide to Creating Churn
 
50 Great Products For Startups
50 Great Products For Startups50 Great Products For Startups
50 Great Products For Startups
 
Gappsy Review - Create faster and Amazing apps for IOS and Android
Gappsy Review - Create faster and Amazing apps for IOS and AndroidGappsy Review - Create faster and Amazing apps for IOS and Android
Gappsy Review - Create faster and Amazing apps for IOS and Android
 
Collaborating Effectively with Developers
Collaborating Effectively with DevelopersCollaborating Effectively with Developers
Collaborating Effectively with Developers
 
Mvp tools
Mvp toolsMvp tools
Mvp tools
 
Delivering Content via Mobile
Delivering Content via Mobile Delivering Content via Mobile
Delivering Content via Mobile
 
Creating an Interactive Book with iBooks Author #mLearnCon15
Creating an Interactive Book with iBooks Author #mLearnCon15Creating an Interactive Book with iBooks Author #mLearnCon15
Creating an Interactive Book with iBooks Author #mLearnCon15
 
How to write compelling user stories
How to write compelling user storiesHow to write compelling user stories
How to write compelling user stories
 
Prototyping invision vs axure
Prototyping invision vs axurePrototyping invision vs axure
Prototyping invision vs axure
 
Digital summit denver creating customer experience design
Digital summit denver   creating customer experience designDigital summit denver   creating customer experience design
Digital summit denver creating customer experience design
 
Web Design Assessment
Web Design AssessmentWeb Design Assessment
Web Design Assessment
 
How to Improve Mobile Business (SqueezeMobillionaire)
How to Improve Mobile Business (SqueezeMobillionaire)How to Improve Mobile Business (SqueezeMobillionaire)
How to Improve Mobile Business (SqueezeMobillionaire)
 
Build Key UI Elements in High Fidelity
Build Key UI Elements in High FidelityBuild Key UI Elements in High Fidelity
Build Key UI Elements in High Fidelity
 

Similar to Interaction design Do's & Dont's

10 Pitfalls to Avoid in Creating RIAs
10 Pitfalls to Avoid in Creating RIAs10 Pitfalls to Avoid in Creating RIAs
10 Pitfalls to Avoid in Creating RIAsEffective
 
10 Pitfalls to Avoid in Creating RIAs
10 Pitfalls to Avoid in Creating RIAs10 Pitfalls to Avoid in Creating RIAs
10 Pitfalls to Avoid in Creating RIAsEffectiveUI
 
Mobile App Design Best Practices - Usable Interfaces for Tiny Places
Mobile App Design Best Practices - Usable Interfaces for Tiny PlacesMobile App Design Best Practices - Usable Interfaces for Tiny Places
Mobile App Design Best Practices - Usable Interfaces for Tiny PlacesApigee | Google Cloud
 
Design, Create and Develop Your Own Matrimony Website
Design, Create and Develop Your Own Matrimony WebsiteDesign, Create and Develop Your Own Matrimony Website
Design, Create and Develop Your Own Matrimony WebsiteSidu Ponnappa
 
Interactive Design Basics
Interactive Design Basics Interactive Design Basics
Interactive Design Basics katy walker
 
Web Designer vs Web Developer What’s the Difference
Web Designer vs Web Developer What’s the DifferenceWeb Designer vs Web Developer What’s the Difference
Web Designer vs Web Developer What’s the DifferencePixlogix Infotech
 
UX, Front-end and Back-end: How front-end can help these guys?
UX, Front-end and Back-end: How front-end can help these guys?UX, Front-end and Back-end: How front-end can help these guys?
UX, Front-end and Back-end: How front-end can help these guys?Diego Eis
 
From mobile browser to mobile app
From mobile browser to mobile appFrom mobile browser to mobile app
From mobile browser to mobile appRyan Stewart
 
Adesiyan Report on GUI effectiveness
Adesiyan Report on GUI effectivenessAdesiyan Report on GUI effectiveness
Adesiyan Report on GUI effectivenessJelilat Adesiyan
 
Front End Development
Front End Development Front End Development
Front End Development Вѓд Сн
 
Web design vs web development- This is all you need to know
Web design vs web development- This is all you need to knowWeb design vs web development- This is all you need to know
Web design vs web development- This is all you need to knowsangerarayal
 
Responsive Website Design
Responsive Website DesignResponsive Website Design
Responsive Website DesignArin Shamima
 
Prophets trends in Interactive Design 2012
Prophets trends in Interactive Design 2012Prophets trends in Interactive Design 2012
Prophets trends in Interactive Design 2012Prophets Agency
 
UX Super Powers with #ProjectComet
UX Super Powers with #ProjectCometUX Super Powers with #ProjectComet
UX Super Powers with #ProjectCometDemian Borba
 
web development versus web design
web development versus web designweb development versus web design
web development versus web designDigital Ipsum
 
How To be a Backend developer
How To be a Backend developer    How To be a Backend developer
How To be a Backend developer Ramy Hakam
 

Similar to Interaction design Do's & Dont's (20)

Design Prototyping
Design PrototypingDesign Prototyping
Design Prototyping
 
10 Pitfalls to Avoid in Creating RIAs
10 Pitfalls to Avoid in Creating RIAs10 Pitfalls to Avoid in Creating RIAs
10 Pitfalls to Avoid in Creating RIAs
 
10 Pitfalls to Avoid in Creating RIAs
10 Pitfalls to Avoid in Creating RIAs10 Pitfalls to Avoid in Creating RIAs
10 Pitfalls to Avoid in Creating RIAs
 
Mobile App Design Best Practices - Usable Interfaces for Tiny Places
Mobile App Design Best Practices - Usable Interfaces for Tiny PlacesMobile App Design Best Practices - Usable Interfaces for Tiny Places
Mobile App Design Best Practices - Usable Interfaces for Tiny Places
 
Design, Create and Develop Your Own Matrimony Website
Design, Create and Develop Your Own Matrimony WebsiteDesign, Create and Develop Your Own Matrimony Website
Design, Create and Develop Your Own Matrimony Website
 
Maintainable design
Maintainable designMaintainable design
Maintainable design
 
Interactive Design Basics
Interactive Design Basics Interactive Design Basics
Interactive Design Basics
 
Web Designer vs Web Developer What’s the Difference
Web Designer vs Web Developer What’s the DifferenceWeb Designer vs Web Developer What’s the Difference
Web Designer vs Web Developer What’s the Difference
 
UX, Front-end and Back-end: How front-end can help these guys?
UX, Front-end and Back-end: How front-end can help these guys?UX, Front-end and Back-end: How front-end can help these guys?
UX, Front-end and Back-end: How front-end can help these guys?
 
Prophets trends-in-interactive-design
Prophets trends-in-interactive-designProphets trends-in-interactive-design
Prophets trends-in-interactive-design
 
From mobile browser to mobile app
From mobile browser to mobile appFrom mobile browser to mobile app
From mobile browser to mobile app
 
Adesiyan Report on GUI effectiveness
Adesiyan Report on GUI effectivenessAdesiyan Report on GUI effectiveness
Adesiyan Report on GUI effectiveness
 
Front End Development
Front End Development Front End Development
Front End Development
 
Web design vs web development- This is all you need to know
Web design vs web development- This is all you need to knowWeb design vs web development- This is all you need to know
Web design vs web development- This is all you need to know
 
Responsive Website Design
Responsive Website DesignResponsive Website Design
Responsive Website Design
 
Prophets trends in Interactive Design 2012
Prophets trends in Interactive Design 2012Prophets trends in Interactive Design 2012
Prophets trends in Interactive Design 2012
 
UX Super Powers with #ProjectComet
UX Super Powers with #ProjectCometUX Super Powers with #ProjectComet
UX Super Powers with #ProjectComet
 
web development versus web design
web development versus web designweb development versus web design
web development versus web design
 
How To be a Backend developer
How To be a Backend developer    How To be a Backend developer
How To be a Backend developer
 
Rules For Modern Web App Development
Rules For Modern Web App DevelopmentRules For Modern Web App Development
Rules For Modern Web App Development
 

Recently uploaded

SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationSlibray Presentation
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfAlex Barbosa Coqueiro
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsSergiu Bodiu
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr LapshynFwdays
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxNavinnSomaal
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenHervé Boutemy
 
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsAI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsMemoori
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machinePadma Pradeep
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxhariprasad279825
 
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Wonjun Hwang
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 
Vector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesVector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesZilliz
 

Recently uploaded (20)

SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck Presentation
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdf
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platforms
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptx
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache Maven
 
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsAI as an Interface for Commercial Buildings
AI as an Interface for Commercial Buildings
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machine
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptx
 
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 
Vector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesVector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector Databases
 

Interaction design Do's & Dont's