SlideShare uma empresa Scribd logo
1 de 43
WEB DESIGN APPLICATIONS Ahsan uddin Shan School of Film & Media Studies Ngee Ann Polytechnic Week 5: Web Design – design
Objectives ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Design Phase ,[object Object],[object Object],[object Object]
Design Phase ,[object Object],[object Object],[object Object]
designing for the user ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
designing for the user ,[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object],designing for the user
designing for the web conventions ,[object Object],[object Object],[object Object],[object Object],[object Object]
how  people see your web sites ,[object Object],3. what else is here ? 2. what else is here ?
where users expect things to  be ,[object Object],6 6 2 3  4 5  logo shopping cart, help about us, contact us site navigation bar
visual convention on  (and off) the web ,[object Object]
Sketch the essential features & look
Sketch the essential features & look ,[object Object],[object Object],[object Object],[object Object]
choosing software for web design ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
designing for different systems ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
6 steps to cross-platform design: ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
designing for speed ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
8 tricks to designing for speed ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
the well-organized site ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
site organization ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
structuring your site ,[object Object],[object Object],[object Object],[object Object],[object Object]
6 ways to organize your site: by category ,[object Object],[object Object]
6 ways to organize your site: by task ,[object Object],[object Object]
[object Object],6 ways to organize your site: by user
[object Object],6 ways to organize your site: by language location
[object Object],6 ways to organize your site:  by date or order
[object Object],[object Object],6 ways to organize your site: by  corporate department
[object Object],[object Object],[object Object],[object Object],[object Object],documenting the site structure
[object Object],[object Object],[object Object],[object Object],the user path
Story Board ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Camera Home Design
Story Board ,[object Object],[object Object],[object Object],GQ // home page fashion gear news urbanwire heatwave latest ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Detailed Sketches http://ela10b.dev.kcdc.ca/~greentela10/unit1/racial/lesson3/sstoryboard.html
 
 
[object Object],[object Object],[object Object],[object Object],what users learn from your  navigation
8  bad ideas for site navigation ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
12 navigation systems ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
global and local navigation ,[object Object],[object Object],[object Object]
12 navigation systems ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
naming site sections ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],Organize views into a site map
 
References ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Mais conteúdo relacionado

Mais procurados

10 Principles Of Effective Web Design
10 Principles Of Effective Web Design10 Principles Of Effective Web Design
10 Principles Of Effective Web Designsirferds
 
Website Navigation - Some Tips
Website Navigation - Some TipsWebsite Navigation - Some Tips
Website Navigation - Some Tipsffats1
 
Chapter 2 | Website design & development - pf
Chapter 2  | Website design & development - pfChapter 2  | Website design & development - pf
Chapter 2 | Website design & development - pfMikaStuttaford
 
6 Key Principles Of Making A Web Design
6 Key Principles Of Making A Web Design6 Key Principles Of Making A Web Design
6 Key Principles Of Making A Web DesignClippingimages
 
Elements Of Web Design
Elements Of Web DesignElements Of Web Design
Elements Of Web DesignDan Dixon
 
Chapter 2 | Website design & development
Chapter 2  | Website design & developmentChapter 2  | Website design & development
Chapter 2 | Website design & developmentMikaStuttaford
 
Planning Site Navigation
Planning Site NavigationPlanning Site Navigation
Planning Site NavigationMukesh Tekwani
 
Realestate Journal Analysis Upload
Realestate Journal Analysis UploadRealestate Journal Analysis Upload
Realestate Journal Analysis UploadSatyajit Das
 
Realestate Journal Analysis Upload
Realestate Journal Analysis UploadRealestate Journal Analysis Upload
Realestate Journal Analysis UploadSatyajit Das
 
Website usability ideas for business growth
Website usability ideas for business growthWebsite usability ideas for business growth
Website usability ideas for business growthJames Smith
 
ًWebsite_development and design
ًWebsite_development and designًWebsite_development and design
ًWebsite_development and designMaged Elsakka
 
Usability review&mockups mohan talluri
Usability review&mockups   mohan talluriUsability review&mockups   mohan talluri
Usability review&mockups mohan talluriMohan Talluri
 
Bia Marketing Presentation Huber Web Design
Bia Marketing Presentation Huber Web DesignBia Marketing Presentation Huber Web Design
Bia Marketing Presentation Huber Web Designruthmilligan
 
Webdesign New
Webdesign NewWebdesign New
Webdesign Newlyngdoh
 

Mais procurados (20)

10 Principles Of Effective Web Design
10 Principles Of Effective Web Design10 Principles Of Effective Web Design
10 Principles Of Effective Web Design
 
Website Navigation - Some Tips
Website Navigation - Some TipsWebsite Navigation - Some Tips
Website Navigation - Some Tips
 
Web Site Design,
Web Site Design,Web Site Design,
Web Site Design,
 
WebBestPractices3
WebBestPractices3WebBestPractices3
WebBestPractices3
 
Chapter 2 | Website design & development - pf
Chapter 2  | Website design & development - pfChapter 2  | Website design & development - pf
Chapter 2 | Website design & development - pf
 
Designing Navigation
Designing NavigationDesigning Navigation
Designing Navigation
 
6 Key Principles Of Making A Web Design
6 Key Principles Of Making A Web Design6 Key Principles Of Making A Web Design
6 Key Principles Of Making A Web Design
 
Web site design
Web site designWeb site design
Web site design
 
Elements Of Web Design
Elements Of Web DesignElements Of Web Design
Elements Of Web Design
 
Chapter 2 | Website design & development
Chapter 2  | Website design & developmentChapter 2  | Website design & development
Chapter 2 | Website design & development
 
Planning Site Navigation
Planning Site NavigationPlanning Site Navigation
Planning Site Navigation
 
Realestate Journal Analysis Upload
Realestate Journal Analysis UploadRealestate Journal Analysis Upload
Realestate Journal Analysis Upload
 
Realestate Journal Analysis Upload
Realestate Journal Analysis UploadRealestate Journal Analysis Upload
Realestate Journal Analysis Upload
 
Website usability ideas for business growth
Website usability ideas for business growthWebsite usability ideas for business growth
Website usability ideas for business growth
 
ًWebsite_development and design
ًWebsite_development and designًWebsite_development and design
ًWebsite_development and design
 
Usability review&mockups mohan talluri
Usability review&mockups   mohan talluriUsability review&mockups   mohan talluri
Usability review&mockups mohan talluri
 
Bia Marketing Presentation Huber Web Design
Bia Marketing Presentation Huber Web DesignBia Marketing Presentation Huber Web Design
Bia Marketing Presentation Huber Web Design
 
Jamal Qaiyyim Ch3
Jamal Qaiyyim Ch3Jamal Qaiyyim Ch3
Jamal Qaiyyim Ch3
 
Web design principles
Web design principlesWeb design principles
Web design principles
 
Webdesign New
Webdesign NewWebdesign New
Webdesign New
 

Semelhante a Web Design Phase

Lecture4
Lecture4Lecture4
Lecture4hstryk
 
1 httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2 ht.docx
1  httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2  ht.docx1  httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2  ht.docx
1 httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2 ht.docxjeremylockett77
 
5. ergonomic of www interface
5. ergonomic of www interface5. ergonomic of www interface
5. ergonomic of www interfaceKh Ravy
 
Application Design - Part 1
Application Design - Part 1Application Design - Part 1
Application Design - Part 1Kelley Howell
 
Usability Guidelines
Usability GuidelinesUsability Guidelines
Usability Guidelineshomeplate31
 
Professional ui for a website design
Professional ui for a website designProfessional ui for a website design
Professional ui for a website designRavi Bhadauria
 
Promote Education Web Design Things To Consider When Designing A Website
Promote Education Web Design Things To Consider When Designing A WebsitePromote Education Web Design Things To Consider When Designing A Website
Promote Education Web Design Things To Consider When Designing A WebsiteZoaib Mirza
 
User centered design process - Measurefest Presentation
User centered design process - Measurefest PresentationUser centered design process - Measurefest Presentation
User centered design process - Measurefest Presentationflashbender
 
T2L3.doc
T2L3.docT2L3.doc
T2L3.docbutest
 
User Centered Design and SharePoint Publishing Portals
User Centered Design and SharePoint Publishing PortalsUser Centered Design and SharePoint Publishing Portals
User Centered Design and SharePoint Publishing PortalsTom Pham
 
Web Live! Developing a Web Information Service
Web Live! Developing a Web Information ServiceWeb Live! Developing a Web Information Service
Web Live! Developing a Web Information ServiceJesús Tramullas
 
Web Usability Site Design
Web Usability   Site DesignWeb Usability   Site Design
Web Usability Site DesignOvidiu Von M
 

Semelhante a Web Design Phase (20)

Lecture4
Lecture4Lecture4
Lecture4
 
1 httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2 ht.docx
1  httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2  ht.docx1  httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2  ht.docx
1 httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2 ht.docx
 
5. ergonomic of www interface
5. ergonomic of www interface5. ergonomic of www interface
5. ergonomic of www interface
 
Application Design - Part 1
Application Design - Part 1Application Design - Part 1
Application Design - Part 1
 
Usability Guidelines
Usability GuidelinesUsability Guidelines
Usability Guidelines
 
Website Sitemap
Website SitemapWebsite Sitemap
Website Sitemap
 
Web Design
Web DesignWeb Design
Web Design
 
4 Interface Design
4 Interface Design4 Interface Design
4 Interface Design
 
Professional ui for a website design
Professional ui for a website designProfessional ui for a website design
Professional ui for a website design
 
MKT 460 Week 3
MKT 460 Week 3MKT 460 Week 3
MKT 460 Week 3
 
Mkt460 Week3
Mkt460 Week3Mkt460 Week3
Mkt460 Week3
 
Promote Education Web Design Things To Consider When Designing A Website
Promote Education Web Design Things To Consider When Designing A WebsitePromote Education Web Design Things To Consider When Designing A Website
Promote Education Web Design Things To Consider When Designing A Website
 
User centered design process - Measurefest Presentation
User centered design process - Measurefest PresentationUser centered design process - Measurefest Presentation
User centered design process - Measurefest Presentation
 
T2L3.doc
T2L3.docT2L3.doc
T2L3.doc
 
User Centered Design and SharePoint Publishing Portals
User Centered Design and SharePoint Publishing PortalsUser Centered Design and SharePoint Publishing Portals
User Centered Design and SharePoint Publishing Portals
 
IA workshop
IA workshopIA workshop
IA workshop
 
Web Live! Developing a Web Information Service
Web Live! Developing a Web Information ServiceWeb Live! Developing a Web Information Service
Web Live! Developing a Web Information Service
 
Web Usability Site Design
Web Usability   Site DesignWeb Usability   Site Design
Web Usability Site Design
 
Website development
Website developmentWebsite development
Website development
 
Website development
Website developmentWebsite development
Website development
 

Último

[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdfSandro Moreira
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...apidays
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDropbox
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...Zilliz
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamUiPathCommunity
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesrafiqahmad00786416
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistandanishmna97
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityWSO2
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAndrey Devyatkin
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontologyjohnbeverley2021
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Victor Rentea
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...apidays
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusZilliz
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodJuan lago vázquez
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native ApplicationsWSO2
 

Último (20)

[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 

Web Design Phase