SlideShare a Scribd company logo
Creative  Design  &  Usability   Engineering
Overview ,[object Object],Usability Engineering/Human Computer Interaction/ Interaction Design/User Experience Design
User Experience Design - Methodology
Artifacts of Design Practice ,[object Object],[object Object],Site Maps Storyboards Schematics Mock-ups ,[object Object]
Schematics ,[object Object]
Mock-ups ,[object Object]
Mock-ups
[object Object]
How the Eyes Move ,[object Object],[object Object],[Eyetrack III, Poynter Inst. 2003]
How Users Look at News Web Sites ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[Eyetrack III, Poynter Inst. 2003]
Response Times ,[object Object],[object Object],[object Object],[object Object],[Nielsen 1997, Miller 1968, Card et al. 1991]
Color Schemes ,[object Object],[object Object],[object Object],[object Object],[Skaalid 1999, Classic Graphic Design Theory]
Costco Implementation ,[object Object],[object Object]
Text and Background ,[object Object],[object Object],[object Object]
How to Make Web Pages Readable ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[Nielsen, 2006]
Costco Implementation ,[object Object]
Skill Sets ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Skill Sets ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Online Design work www.vayama.com www.onhotels.com www.sotctours.com  www.costcotravel.com  www.alaska.org  www.classicvacations.com www.ftc-i.net www.endurancegroup.com mahades.maharashtra.gov.in www.door2tour.com www.proflowers.com reservations.wynnlasvegas.com www.voyage.tv electronics.bluestarindia.com ,[object Object]
Thank You Engineering Business Outcomes ,[object Object]

More Related Content

Similar to Creative Design Process and Best Practices

ARTDM 171 Week 9: Designing Page Comps
ARTDM 171 Week 9: Designing Page CompsARTDM 171 Week 9: Designing Page Comps
ARTDM 171 Week 9: Designing Page CompsGilbert Guerrero
 
Edge903 Project
Edge903 ProjectEdge903 Project
Edge903 Projectxyz01
 
Requirements Definitions Of The Geospatial Web
Requirements Definitions Of The Geospatial WebRequirements Definitions Of The Geospatial Web
Requirements Definitions Of The Geospatial WebMichael Maclennan
 
Basics of Web Accessibility
Basics of Web AccessibilityBasics of Web Accessibility
Basics of Web Accessibility
Moin Shaikh
 
Web designing & web development! BATRA COMPUTER CENTRE
Web designing &  web development! BATRA COMPUTER CENTREWeb designing &  web development! BATRA COMPUTER CENTRE
Web designing & web development! BATRA COMPUTER CENTRE
groversimrans
 
UX / UI Mobile Trends
UX / UI Mobile TrendsUX / UI Mobile Trends
UX / UI Mobile TrendsMark N Swaine
 
Optimizing Sites for Mobile Devices
Optimizing Sites for Mobile DevicesOptimizing Sites for Mobile Devices
Optimizing Sites for Mobile Devices
jameswillweb
 
Responsive Web Designing Fundamentals
Responsive Web Designing FundamentalsResponsive Web Designing Fundamentals
Responsive Web Designing Fundamentals
ADMEC Multimedia Institute
 
Responsive web designing ppt(1)
Responsive web designing ppt(1)Responsive web designing ppt(1)
Responsive web designing ppt(1)
admecindia1
 
13 si(systems analysis and design )
13 si(systems analysis and design )13 si(systems analysis and design )
13 si(systems analysis and design )
Nurdin Al-Azies
 
2230 Fomina Natalia - Memo Ticket - DES509-Magee j-crit-02
2230  Fomina Natalia - Memo Ticket - DES509-Magee j-crit-022230  Fomina Natalia - Memo Ticket - DES509-Magee j-crit-02
2230 Fomina Natalia - Memo Ticket - DES509-Magee j-crit-02
Natalia Fomina
 
Fundamentals of Web Design - Professional Development Workshop
Fundamentals of Web Design - Professional Development Workshop Fundamentals of Web Design - Professional Development Workshop
Fundamentals of Web Design - Professional Development Workshop
Brenna Mickey
 
User Experience Roles Competencies
User Experience  Roles  CompetenciesUser Experience  Roles  Competencies
User Experience Roles Competencies
Sameer Chavan
 
The Science of Subtraction: A Minimalist Guide to Web Design
The Science of Subtraction: A Minimalist Guide to Web DesignThe Science of Subtraction: A Minimalist Guide to Web Design
The Science of Subtraction: A Minimalist Guide to Web Design
ArabNet ME
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web DesignAllan Huang
 
Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI
Michelle Reyes
 
Types of Layouts by ADMEC Multimedia Institute
Types of Layouts by ADMEC Multimedia InstituteTypes of Layouts by ADMEC Multimedia Institute
Types of Layouts by ADMEC Multimedia Institute
Ravi Bhadauria
 
digital marketing[1].pdf
digital marketing[1].pdfdigital marketing[1].pdf
digital marketing[1].pdf
TECHCENTRAL3
 
Web User Experience (BGSU ARTD 302)
Web User Experience (BGSU ARTD 302)Web User Experience (BGSU ARTD 302)
Web User Experience (BGSU ARTD 302)
Keith Instone
 
Web designing
Web designingWeb designing
Web designing
shamiliselvakumar
 

Similar to Creative Design Process and Best Practices (20)

ARTDM 171 Week 9: Designing Page Comps
ARTDM 171 Week 9: Designing Page CompsARTDM 171 Week 9: Designing Page Comps
ARTDM 171 Week 9: Designing Page Comps
 
Edge903 Project
Edge903 ProjectEdge903 Project
Edge903 Project
 
Requirements Definitions Of The Geospatial Web
Requirements Definitions Of The Geospatial WebRequirements Definitions Of The Geospatial Web
Requirements Definitions Of The Geospatial Web
 
Basics of Web Accessibility
Basics of Web AccessibilityBasics of Web Accessibility
Basics of Web Accessibility
 
Web designing & web development! BATRA COMPUTER CENTRE
Web designing &  web development! BATRA COMPUTER CENTREWeb designing &  web development! BATRA COMPUTER CENTRE
Web designing & web development! BATRA COMPUTER CENTRE
 
UX / UI Mobile Trends
UX / UI Mobile TrendsUX / UI Mobile Trends
UX / UI Mobile Trends
 
Optimizing Sites for Mobile Devices
Optimizing Sites for Mobile DevicesOptimizing Sites for Mobile Devices
Optimizing Sites for Mobile Devices
 
Responsive Web Designing Fundamentals
Responsive Web Designing FundamentalsResponsive Web Designing Fundamentals
Responsive Web Designing Fundamentals
 
Responsive web designing ppt(1)
Responsive web designing ppt(1)Responsive web designing ppt(1)
Responsive web designing ppt(1)
 
13 si(systems analysis and design )
13 si(systems analysis and design )13 si(systems analysis and design )
13 si(systems analysis and design )
 
2230 Fomina Natalia - Memo Ticket - DES509-Magee j-crit-02
2230  Fomina Natalia - Memo Ticket - DES509-Magee j-crit-022230  Fomina Natalia - Memo Ticket - DES509-Magee j-crit-02
2230 Fomina Natalia - Memo Ticket - DES509-Magee j-crit-02
 
Fundamentals of Web Design - Professional Development Workshop
Fundamentals of Web Design - Professional Development Workshop Fundamentals of Web Design - Professional Development Workshop
Fundamentals of Web Design - Professional Development Workshop
 
User Experience Roles Competencies
User Experience  Roles  CompetenciesUser Experience  Roles  Competencies
User Experience Roles Competencies
 
The Science of Subtraction: A Minimalist Guide to Web Design
The Science of Subtraction: A Minimalist Guide to Web DesignThe Science of Subtraction: A Minimalist Guide to Web Design
The Science of Subtraction: A Minimalist Guide to Web Design
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI
 
Types of Layouts by ADMEC Multimedia Institute
Types of Layouts by ADMEC Multimedia InstituteTypes of Layouts by ADMEC Multimedia Institute
Types of Layouts by ADMEC Multimedia Institute
 
digital marketing[1].pdf
digital marketing[1].pdfdigital marketing[1].pdf
digital marketing[1].pdf
 
Web User Experience (BGSU ARTD 302)
Web User Experience (BGSU ARTD 302)Web User Experience (BGSU ARTD 302)
Web User Experience (BGSU ARTD 302)
 
Web designing
Web designingWeb designing
Web designing
 

Recently uploaded

Exploring the Future of Smart Garages.pdf
Exploring the Future of Smart Garages.pdfExploring the Future of Smart Garages.pdf
Exploring the Future of Smart Garages.pdf
fastfixgaragedoor
 
Transforming Brand Perception and Boosting Profitability
Transforming Brand Perception and Boosting ProfitabilityTransforming Brand Perception and Boosting Profitability
Transforming Brand Perception and Boosting Profitability
aaryangarg12
 
Borys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior designBorys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior design
boryssutkowski
 
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
7sd8fier
 
Can AI do good? at 'offtheCanvas' India HCI prelude
Can AI do good? at 'offtheCanvas' India HCI preludeCan AI do good? at 'offtheCanvas' India HCI prelude
Can AI do good? at 'offtheCanvas' India HCI prelude
Alan Dix
 
Common Designing Mistakes and How to avoid them
Common Designing Mistakes and How to avoid themCommon Designing Mistakes and How to avoid them
Common Designing Mistakes and How to avoid them
madhavlakhanpal29
 
Design Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinkingDesign Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinking
cy0krjxt
 
vernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdfvernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdf
PrabhjeetSingh219035
 
20 slides of research movie and artists .pdf
20 slides of research movie and artists .pdf20 slides of research movie and artists .pdf
20 slides of research movie and artists .pdf
ameli25062005
 
一比一原版(Glasgow毕业证书)格拉斯哥大学毕业证成绩单如何办理
一比一原版(Glasgow毕业证书)格拉斯哥大学毕业证成绩单如何办理一比一原版(Glasgow毕业证书)格拉斯哥大学毕业证成绩单如何办理
一比一原版(Glasgow毕业证书)格拉斯哥大学毕业证成绩单如何办理
n0tivyq
 
Portfolio.pdf
Portfolio.pdfPortfolio.pdf
Portfolio.pdf
garcese
 
Design Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinkingDesign Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinking
cy0krjxt
 
Expert Accessory Dwelling Unit (ADU) Drafting Services
Expert Accessory Dwelling Unit (ADU) Drafting ServicesExpert Accessory Dwelling Unit (ADU) Drafting Services
Expert Accessory Dwelling Unit (ADU) Drafting Services
ResDraft
 
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
9a93xvy
 
projectreportnew-170307082323 nnnnnn(1).pdf
projectreportnew-170307082323 nnnnnn(1).pdfprojectreportnew-170307082323 nnnnnn(1).pdf
projectreportnew-170307082323 nnnnnn(1).pdf
farazahmadas6
 
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
smpc3nvg
 
一比一原版(Brunel毕业证书)布鲁内尔大学毕业证成绩单如何办理
一比一原版(Brunel毕业证书)布鲁内尔大学毕业证成绩单如何办理一比一原版(Brunel毕业证书)布鲁内尔大学毕业证成绩单如何办理
一比一原版(Brunel毕业证书)布鲁内尔大学毕业证成绩单如何办理
smpc3nvg
 
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
jyz59f4j
 
一比一原版(毕业证)长崎大学毕业证成绩单如何办理
一比一原版(毕业证)长崎大学毕业证成绩单如何办理一比一原版(毕业证)长崎大学毕业证成绩单如何办理
一比一原版(毕业证)长崎大学毕业证成绩单如何办理
taqyed
 
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdfPORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
fabianavillanib
 

Recently uploaded (20)

Exploring the Future of Smart Garages.pdf
Exploring the Future of Smart Garages.pdfExploring the Future of Smart Garages.pdf
Exploring the Future of Smart Garages.pdf
 
Transforming Brand Perception and Boosting Profitability
Transforming Brand Perception and Boosting ProfitabilityTransforming Brand Perception and Boosting Profitability
Transforming Brand Perception and Boosting Profitability
 
Borys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior designBorys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior design
 
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
 
Can AI do good? at 'offtheCanvas' India HCI prelude
Can AI do good? at 'offtheCanvas' India HCI preludeCan AI do good? at 'offtheCanvas' India HCI prelude
Can AI do good? at 'offtheCanvas' India HCI prelude
 
Common Designing Mistakes and How to avoid them
Common Designing Mistakes and How to avoid themCommon Designing Mistakes and How to avoid them
Common Designing Mistakes and How to avoid them
 
Design Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinkingDesign Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinking
 
vernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdfvernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdf
 
20 slides of research movie and artists .pdf
20 slides of research movie and artists .pdf20 slides of research movie and artists .pdf
20 slides of research movie and artists .pdf
 
一比一原版(Glasgow毕业证书)格拉斯哥大学毕业证成绩单如何办理
一比一原版(Glasgow毕业证书)格拉斯哥大学毕业证成绩单如何办理一比一原版(Glasgow毕业证书)格拉斯哥大学毕业证成绩单如何办理
一比一原版(Glasgow毕业证书)格拉斯哥大学毕业证成绩单如何办理
 
Portfolio.pdf
Portfolio.pdfPortfolio.pdf
Portfolio.pdf
 
Design Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinkingDesign Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinking
 
Expert Accessory Dwelling Unit (ADU) Drafting Services
Expert Accessory Dwelling Unit (ADU) Drafting ServicesExpert Accessory Dwelling Unit (ADU) Drafting Services
Expert Accessory Dwelling Unit (ADU) Drafting Services
 
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
 
projectreportnew-170307082323 nnnnnn(1).pdf
projectreportnew-170307082323 nnnnnn(1).pdfprojectreportnew-170307082323 nnnnnn(1).pdf
projectreportnew-170307082323 nnnnnn(1).pdf
 
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
 
一比一原版(Brunel毕业证书)布鲁内尔大学毕业证成绩单如何办理
一比一原版(Brunel毕业证书)布鲁内尔大学毕业证成绩单如何办理一比一原版(Brunel毕业证书)布鲁内尔大学毕业证成绩单如何办理
一比一原版(Brunel毕业证书)布鲁内尔大学毕业证成绩单如何办理
 
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
 
一比一原版(毕业证)长崎大学毕业证成绩单如何办理
一比一原版(毕业证)长崎大学毕业证成绩单如何办理一比一原版(毕业证)长崎大学毕业证成绩单如何办理
一比一原版(毕业证)长崎大学毕业证成绩单如何办理
 
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdfPORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
 

Creative Design Process and Best Practices

Editor's Notes

  1. We realize that what matters most are not just great technology solutions, but building great presentation systems that shape the user experience and create positive brand interactions, which ultimately translate to greater value for the client and better-engineered solutions at the back-end.
  2. Usability Engineering is a planned & methodical approach to developing any products & websites that works for the users and deliver the results that they are looking for. It ’ s a practical and systematic way of creating user interfaces and the framework through which a user would interact with the product or the website
  3. Interaction: Determine the goals for the solution from the perspective of the user and the business Determine the user profile, user needs, user behaviour & concerns and target usability requirements Determine feature functionality Evaluate existing versions of the product (If any) Perform a competitive analysis   Ideation: Sketch out information architecture & navigational flow at an abstract level Create and project an identity that ’ s true to the core brand properties and can be owned by no one else Develop and streamline content Ideating concept & theme Design interface layout keeping the brand orientation and usability aspect in mind. Interactive visual presentation (conceptual prototype) for the client ’ s approval. Repeat this process (production iteration) until the business goals and user needs are met.   Implementation: Create templates and perform validation, compatibility, optimization testing. Development of UID - user interface design (Functional prototype). Evaluate performance through testing, quality assurance, usability testing, compatibility & scalability testing Repeat this process (production iteration) until the business goals are met. The final deliverable of this process is relevant functionality, strong branding, user-centric design and consistent look & feel demonstrated through UID.    
  4. Mention that these are “real artifacts.”
  5. Represents the information and navigation content of a page. Graphic elements are used such as shading, typography, line, layout – but these are not meant to be taken literally from a graphic design standpoint. These would often be roughed out using pen and paper and then created using a graphics program like Illustrator. Sometimes in HTML, sometimes in Word, sometimes in Visio.
  6. Sometimes roughed out on paper, though if working from schematics perhaps not. Usually created in Photoshop, sometimes would evolve to “dead” or “semi-active” HTML.