SlideShare uma empresa Scribd logo
1 de 30
Web Design
For A Startup
  Business
 Mavic Pineda
 IT Department-CCS
 12 Nov 2005
Understand your web guests.
   Who is your target shopper??
Over 40 items in one window
IMAGERY is important.
 Use effective photos!
Design for what users want.
Design for real people.
Design with human limitations in mind.
Build a retention strategy.
   Retention is a result of a user-
friendly web site. It is a function of
getting service right the first time at
   the end of an order fulfillment.
What do people like?
Ease of use
Speed
Practicality
Credibility
Simplicity
Support
Design for Usability

“A usable web is one that allows users
to do what they need to do, or get help
 easily, without becoming frustrated.”
General Principles for Web Design
  Consistency
  Interaction
  Instruction
  Choices
  Navigation-hierarchical, sequential,
  narrow & deep, broad & shallow)
  Control
Create Persona
A persona is a profile of an archetypal
user.
Includes a name, social history & set of
goals that drive the website1.



1
    The concept was developed by Cooper Interaction Design (www.cooper.com)
Visual Principles for Web Design
  Graphics
Visual Principles for Web Design
  Text
  Layout             Serif
  Color
  Web-safe colors   San serif
A Furniture Store
A Gift Shop
Other tools
Cognitive walk-through
Usability audit
Focus groups
Log file analysis
Recommended foreign sites to
          visit
www.smithandhawken - high-end gardening
supply store
www.castorpolluxpet.com - maker of premium
pet products
www.ashford.com - internet retailer of
watches, jewelry & other accessories
www.staples.com - office supply retailer
http://www.iokio.biz/ - go to camera finder;
this is an example of information visualization
Recommended local sites to visit
 www.myayala.com – leading local
 virtual store
 www.rustansupermarket.com - online
 grocery service of Rustan’s
 www.sureseats.com - allows online
 movie ticket purchases
Rooms for improvement
Inborn Inc. -
http://www.geocities.com/inborn_incorporated/ - where’s
the cake; change the mood
Comfort Zone Inc. -
http://www.geocities.com/comfortzone_inc/
How do I use the product? How much is it?
Mood Creators Inc. -
http://www.geocities.com/moodcreators2004/ - too heavy
on text information; example of the theme service
dBS Inc. - http://dbs2005.tripod.com/
How Sweet It Is Inc. - http://www.mysweetsurrender.tk –
minor revisions; what’s the price, minimum order req’t?
http://www.geocities.com/exciting_incorporated/ -
rearrange the structure; make the pictures bigger and
brighter
Rooms for improvement
K31 - Accentuate, Inc. - http://www.accentuate.fil.ph/index.htm - good company logo &
web structure; enter site page should contain the model & product; not the company
logo; indicate if this is the product of the Phils; would you rather be a cosmetic company
or a skin care specialist?; featured & new products-what’s the main product?; improve
online order page & add landline numbers to your contact page
K32 - Apostles of the Sun Partnership - http://www.tantease.tk - effective photos; good
product layout page; slow site, 72dpi res will do
K33 - Aura Ventures, Inc. – http://aurasence.bravehost.com/Main.htm
- improve news section; consider changing font styles; consider telling the difference of
rose & chamomile in terms of use; forum for posting orders may not be that effective
K34 - Bata Batuta, Inc. - http://www.t-patch.com - vague product desc;show where the
patch can be placed; invest on effective photos
K36 - Bocha Monde, Inc. - http://bocha.topcities.com- show photos of your moochies;
remove extra nav bar
K37 - Bread Crave Corp. - http://www.breadcrave.tk or
http://www.freewebtown.com/breadcrave - too many disclaimers
K38 - Bugs Away Corp. - http://www.geocities.com/bugsawaycorp- content page color
should be consistent, don’t use too many colors on one page

 
PROJECTS TO BE
           REVIEWED
K31 - Accentuate, Inc. -
http://www.accentuate.fil.ph/index.htm
K32 - Apostles of the Sun Partnership -
http://www.tantease.tk
K33 - Aura Ventures, Inc. -
http://aurasence.bravehost.com/Main.htm
K34 - Bata Batuta, Inc. - http://www.t-patch.com
K35 - Berliner Corp. - http://www.oatdoughnuts.tk
K36 - Bocha Monde, Inc. - http://bocha.topcities.com
K37 - Bread Crave Corp. - http://www.breadcrave.tk or
                http://www.freewebtown.com/breadcrave
K38 - Bugs Away Corp. -
http://www.geocities.com/bugsawaycorp
PROJECTS TO BE
         REVIEWED
K39 - BURP, Inc. -
http://burp.atspace.com/index.html
K40 - Enigma, Inc. -
http://uk.messenger.yahoo.com
K41 - Flecsy Partnership - http://lotir.tripod.com
K42 - Gello made Corp. -
http://www.gellomade.cjb.net/
K43 - Iced Paradise Corpration
-http://www.geocities.com/icedparadisecorpor
ation
General Recommendations
Welcome page must be persuasive!
Don’t forget to tell or show what is your
PRODUCT!
About us page should have less emphasis
Use big, clear pictures—with people using,
consuming the product.
Don’t forget your prices and the
package/discount that you’re offering.
Skip unnecessary information.
Please check your spelling!!
Any other questions?
Magandang Umaga sa inyong lahat.
Mavic G. Pineda
IT Dept- College of Computer Studies
Presently working on the marketing of
the BS-Information Communications
Technology Management program of
the IT Dept.
Conducts lectures and workshops on E-
commerce, Web and Interactive
Multimedia Designs.

Mais conteúdo relacionado

Semelhante a Web design for shoppers

Company Presentation
Company PresentationCompany Presentation
Company Presentation
Daksh Bhutani
 
Tamara A. Dower.doc
Tamara A. Dower.docTamara A. Dower.doc
Tamara A. Dower.doc
butest
 
Websites: Creating Effective Content and Launching Your Site Aug 2014
Websites: Creating Effective Content and Launching Your Site Aug 2014Websites: Creating Effective Content and Launching Your Site Aug 2014
Websites: Creating Effective Content and Launching Your Site Aug 2014
Greg Woodham
 

Semelhante a Web design for shoppers (20)

Company Presentation
Company PresentationCompany Presentation
Company Presentation
 
Redesign Proposal: Novaspaceart.com
Redesign Proposal: Novaspaceart.comRedesign Proposal: Novaspaceart.com
Redesign Proposal: Novaspaceart.com
 
Cover & Carry Internet Marketing Plan
Cover & Carry Internet Marketing PlanCover & Carry Internet Marketing Plan
Cover & Carry Internet Marketing Plan
 
Decoding Digital Week 2: Design & Implementation
Decoding Digital Week 2: Design & ImplementationDecoding Digital Week 2: Design & Implementation
Decoding Digital Week 2: Design & Implementation
 
chrisans solution development
 chrisans solution  development  chrisans solution  development
chrisans solution development
 
Update Resume
Update ResumeUpdate Resume
Update Resume
 
Creating a Website For Your Business
Creating a Website For Your BusinessCreating a Website For Your Business
Creating a Website For Your Business
 
Tamara A. Dower.doc
Tamara A. Dower.docTamara A. Dower.doc
Tamara A. Dower.doc
 
Nike.Com
Nike.ComNike.Com
Nike.Com
 
Nike.Com
Nike.ComNike.Com
Nike.Com
 
Natural born conversion killers - Conversion Jam
Natural born conversion killers - Conversion JamNatural born conversion killers - Conversion Jam
Natural born conversion killers - Conversion Jam
 
Customers Presentation ArfaTechnologies.com
Customers Presentation ArfaTechnologies.comCustomers Presentation ArfaTechnologies.com
Customers Presentation ArfaTechnologies.com
 
Jeet
JeetJeet
Jeet
 
Information Architecture for Drupal
Information Architecture for DrupalInformation Architecture for Drupal
Information Architecture for Drupal
 
Inside eCommerce - Design for Success - Micksgarage.com- Brendan McMahon
Inside eCommerce - Design for Success - Micksgarage.com- Brendan McMahonInside eCommerce - Design for Success - Micksgarage.com- Brendan McMahon
Inside eCommerce - Design for Success - Micksgarage.com- Brendan McMahon
 
Websites: Creating Effective Content and Launching Your Site Aug 2014
Websites: Creating Effective Content and Launching Your Site Aug 2014Websites: Creating Effective Content and Launching Your Site Aug 2014
Websites: Creating Effective Content and Launching Your Site Aug 2014
 
What Makes A Good Website 2009 Sth Man
What Makes A Good Website   2009 Sth ManWhat Makes A Good Website   2009 Sth Man
What Makes A Good Website 2009 Sth Man
 
WDS UXP Mobile Web May 2008
WDS UXP Mobile Web May 2008WDS UXP Mobile Web May 2008
WDS UXP Mobile Web May 2008
 
Content Audits for SEO & Site Migration: Picking a website up on your back an...
Content Audits for SEO & Site Migration: Picking a website up on your back an...Content Audits for SEO & Site Migration: Picking a website up on your back an...
Content Audits for SEO & Site Migration: Picking a website up on your back an...
 
Uktisw websites-distr
Uktisw websites-distrUktisw websites-distr
Uktisw websites-distr
 

Mais de Mavic Pineda

Mais de Mavic Pineda (20)

Using ict tools for research writing june 27 update
Using ict tools for  research writing june 27 updateUsing ict tools for  research writing june 27 update
Using ict tools for research writing june 27 update
 
2017 kiddy program seminar for the parents
2017 kiddy program  seminar for the parents2017 kiddy program  seminar for the parents
2017 kiddy program seminar for the parents
 
Developing an Agile ICT Training Model for 21st Century Requirements in the...
Developing an Agile ICT Training Model for 21st Century Requirements in the...Developing an Agile ICT Training Model for 21st Century Requirements in the...
Developing an Agile ICT Training Model for 21st Century Requirements in the...
 
DIY Learning to Collaborative Networking
DIY Learning  to Collaborative NetworkingDIY Learning  to Collaborative Networking
DIY Learning to Collaborative Networking
 
Redefining Community Based Disaster Risk Management through Enhanced Early Wa...
Redefining Community Based Disaster Risk Management through Enhanced Early Wa...Redefining Community Based Disaster Risk Management through Enhanced Early Wa...
Redefining Community Based Disaster Risk Management through Enhanced Early Wa...
 
Designing an exciting self-regulated, indigenized and rhizomatic courseware ...
Designing an exciting self-regulated, indigenized and rhizomatic courseware ...Designing an exciting self-regulated, indigenized and rhizomatic courseware ...
Designing an exciting self-regulated, indigenized and rhizomatic courseware ...
 
Futures-thinking for the next generation ASEANs: facing the 21st century lan...
Futures-thinking for the next generation ASEANs: facing the 21st century lan...Futures-thinking for the next generation ASEANs: facing the 21st century lan...
Futures-thinking for the next generation ASEANs: facing the 21st century lan...
 
The Twitter Human Affair: Persuasive, Persistent, Pervasive
The Twitter Human Affair: Persuasive, Persistent, PervasiveThe Twitter Human Affair: Persuasive, Persistent, Pervasive
The Twitter Human Affair: Persuasive, Persistent, Pervasive
 
Deconstruction of Personal Learning Networks
Deconstruction of Personal Learning Networks Deconstruction of Personal Learning Networks
Deconstruction of Personal Learning Networks
 
Success & dynamics of Community Engagement : the Buklod Tao case study
Success & dynamics of Community Engagement : the Buklod Tao case studySuccess & dynamics of Community Engagement : the Buklod Tao case study
Success & dynamics of Community Engagement : the Buklod Tao case study
 
Social media for teaching and interaction
Social media for teaching and interactionSocial media for teaching and interaction
Social media for teaching and interaction
 
Research Methods Orientation Oct 1
Research Methods Orientation Oct 1Research Methods Orientation Oct 1
Research Methods Orientation Oct 1
 
The search for a Pinoy Cartoon Hero
The search for a Pinoy Cartoon HeroThe search for a Pinoy Cartoon Hero
The search for a Pinoy Cartoon Hero
 
E commerce fundamentals-01mar06
E commerce fundamentals-01mar06E commerce fundamentals-01mar06
E commerce fundamentals-01mar06
 
Ipr and fair use
Ipr and fair useIpr and fair use
Ipr and fair use
 
The great learning experience project
The great learning experience projectThe great learning experience project
The great learning experience project
 
Entrepreneurship 3.0
Entrepreneurship 3.0Entrepreneurship 3.0
Entrepreneurship 3.0
 
Mapping community perceptions, knowledge & experiences ver2
Mapping community perceptions, knowledge & experiences ver2Mapping community perceptions, knowledge & experiences ver2
Mapping community perceptions, knowledge & experiences ver2
 
Discovering my PLE
Discovering my PLEDiscovering my PLE
Discovering my PLE
 
Jaime hilario lasallian mission school and community
Jaime hilario lasallian mission school and communityJaime hilario lasallian mission school and community
Jaime hilario lasallian mission school and community
 

Último

1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
QucHHunhnh
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
QucHHunhnh
 
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdfVishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
ssuserdda66b
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
heathfieldcps1
 

Último (20)

SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and Modifications
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.
 
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the Classroom
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structure
 
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdfVishram Singh - Textbook of Anatomy  Upper Limb and Thorax.. Volume 1 (1).pdf
Vishram Singh - Textbook of Anatomy Upper Limb and Thorax.. Volume 1 (1).pdf
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdf
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptx
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 

Web design for shoppers

  • 1. Web Design For A Startup Business Mavic Pineda IT Department-CCS 12 Nov 2005
  • 2. Understand your web guests. Who is your target shopper??
  • 3.
  • 4. Over 40 items in one window
  • 5. IMAGERY is important. Use effective photos!
  • 6.
  • 7.
  • 8.
  • 9. Design for what users want. Design for real people. Design with human limitations in mind.
  • 10. Build a retention strategy. Retention is a result of a user- friendly web site. It is a function of getting service right the first time at the end of an order fulfillment.
  • 11. What do people like? Ease of use Speed Practicality Credibility Simplicity Support
  • 12.
  • 13.
  • 14. Design for Usability “A usable web is one that allows users to do what they need to do, or get help easily, without becoming frustrated.”
  • 15. General Principles for Web Design Consistency Interaction Instruction Choices Navigation-hierarchical, sequential, narrow & deep, broad & shallow) Control
  • 16. Create Persona A persona is a profile of an archetypal user. Includes a name, social history & set of goals that drive the website1. 1 The concept was developed by Cooper Interaction Design (www.cooper.com)
  • 17. Visual Principles for Web Design Graphics
  • 18. Visual Principles for Web Design Text Layout Serif Color Web-safe colors San serif
  • 21. Other tools Cognitive walk-through Usability audit Focus groups Log file analysis
  • 22. Recommended foreign sites to visit www.smithandhawken - high-end gardening supply store www.castorpolluxpet.com - maker of premium pet products www.ashford.com - internet retailer of watches, jewelry & other accessories www.staples.com - office supply retailer http://www.iokio.biz/ - go to camera finder; this is an example of information visualization
  • 23. Recommended local sites to visit www.myayala.com – leading local virtual store www.rustansupermarket.com - online grocery service of Rustan’s www.sureseats.com - allows online movie ticket purchases
  • 24. Rooms for improvement Inborn Inc. - http://www.geocities.com/inborn_incorporated/ - where’s the cake; change the mood Comfort Zone Inc. - http://www.geocities.com/comfortzone_inc/ How do I use the product? How much is it? Mood Creators Inc. - http://www.geocities.com/moodcreators2004/ - too heavy on text information; example of the theme service dBS Inc. - http://dbs2005.tripod.com/ How Sweet It Is Inc. - http://www.mysweetsurrender.tk – minor revisions; what’s the price, minimum order req’t? http://www.geocities.com/exciting_incorporated/ - rearrange the structure; make the pictures bigger and brighter
  • 25. Rooms for improvement K31 - Accentuate, Inc. - http://www.accentuate.fil.ph/index.htm - good company logo & web structure; enter site page should contain the model & product; not the company logo; indicate if this is the product of the Phils; would you rather be a cosmetic company or a skin care specialist?; featured & new products-what’s the main product?; improve online order page & add landline numbers to your contact page K32 - Apostles of the Sun Partnership - http://www.tantease.tk - effective photos; good product layout page; slow site, 72dpi res will do K33 - Aura Ventures, Inc. – http://aurasence.bravehost.com/Main.htm - improve news section; consider changing font styles; consider telling the difference of rose & chamomile in terms of use; forum for posting orders may not be that effective K34 - Bata Batuta, Inc. - http://www.t-patch.com - vague product desc;show where the patch can be placed; invest on effective photos K36 - Bocha Monde, Inc. - http://bocha.topcities.com- show photos of your moochies; remove extra nav bar K37 - Bread Crave Corp. - http://www.breadcrave.tk or http://www.freewebtown.com/breadcrave - too many disclaimers K38 - Bugs Away Corp. - http://www.geocities.com/bugsawaycorp- content page color should be consistent, don’t use too many colors on one page  
  • 26. PROJECTS TO BE REVIEWED K31 - Accentuate, Inc. - http://www.accentuate.fil.ph/index.htm K32 - Apostles of the Sun Partnership - http://www.tantease.tk K33 - Aura Ventures, Inc. - http://aurasence.bravehost.com/Main.htm K34 - Bata Batuta, Inc. - http://www.t-patch.com K35 - Berliner Corp. - http://www.oatdoughnuts.tk K36 - Bocha Monde, Inc. - http://bocha.topcities.com K37 - Bread Crave Corp. - http://www.breadcrave.tk or http://www.freewebtown.com/breadcrave K38 - Bugs Away Corp. - http://www.geocities.com/bugsawaycorp
  • 27. PROJECTS TO BE REVIEWED K39 - BURP, Inc. - http://burp.atspace.com/index.html K40 - Enigma, Inc. - http://uk.messenger.yahoo.com K41 - Flecsy Partnership - http://lotir.tripod.com K42 - Gello made Corp. - http://www.gellomade.cjb.net/ K43 - Iced Paradise Corpration -http://www.geocities.com/icedparadisecorpor ation
  • 28. General Recommendations Welcome page must be persuasive! Don’t forget to tell or show what is your PRODUCT! About us page should have less emphasis Use big, clear pictures—with people using, consuming the product. Don’t forget your prices and the package/discount that you’re offering. Skip unnecessary information. Please check your spelling!!
  • 29. Any other questions? Magandang Umaga sa inyong lahat.
  • 30. Mavic G. Pineda IT Dept- College of Computer Studies Presently working on the marketing of the BS-Information Communications Technology Management program of the IT Dept. Conducts lectures and workshops on E- commerce, Web and Interactive Multimedia Designs.