Your SlideShare is downloading. ×
Help and Services Portal - Design Process
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Help and Services Portal - Design Process

551
views

Published on

Covers some of the the design and decisions behind the Help and Services Portal for The University of British Columbia website. Presented on Nov 17, 2010

Covers some of the the design and decisions behind the Help and Services Portal for The University of British Columbia website. Presented on Nov 17, 2010

Published in: Design, Technology, Business

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
551
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Transcript

    • 1. Help & Services PortalDESIGN PROCESS
    • 2. HELLO!
    • 3. AS A DESIGNER...data data data
    • 4. Design Process
    • 5. ObjectivesUnderstand design
    • 6. ObjectivesUnderstand designUnderstand user motivations
    • 7. ObjectivesUnderstand designUnderstand user motivationsUnderstand web navigation
    • 8. ObjectivesUnderstand designUnderstand user motivationsUnderstand web navigationUnderstand information architecture
    • 9. ObjectivesUnderstand designUnderstand user motivationsUnderstand web navigationUnderstand information architectureSee how all these fit in Help andServices
    • 10. Objectives ABSTRACTUnderstand designUnderstand user motivationsUnderstand web navigationUnderstand information architectureSee how all these fit in Help and CONCRETEServices
    • 11. Design
    • 12. What is design?
    • 13. What is design?
    • 14. What is design?
    • 15. What is design?
    • 16. “Well Designed” STAINLESS STEEL THINRETINA DISPLAY APPS ACCELEROMETER SLEEK USER INTERFACE A4 PROCESSOR MULTI-TOUCH MIC + SPEAKERS PACKAGING
    • 17. Design = plan
    • 18. Plan implies goalPlan implies problems
    • 19. Design = achieving goalsDesign = solving problems
    • 20. IN WEB DESIGN...“What problem are we trying to solve?”
    • 21. SITES NEED PEOPLE(USERS, VISITORS, CUSTOMERS...)
    • 22. User Motivation
    • 23. Users have a goal
    • 24. “Why are they on your site?”Creating something
    • 25. “Why are they on your site?”Creating somethingPerforming a transaction
    • 26. “Why are they on your site?”Creating somethingPerforming a transactionControlling or monitoring something
    • 27. “Why are they on your site?”Creating somethingPerforming a transactionControlling or monitoring somethingConversing with other people
    • 28. “Why are they on your site?”Creating somethingPerforming a transactionControlling or monitoring somethingConversing with other peopleBeing entertained
    • 29. “Why are they on your site?”Creating somethingPerforming a transactionControlling or monitoring somethingConversing with other peopleBeing entertainedFinding information
    • 30. PEOPLE WANT INFORMATION (AT LEAST FOR OUR PURPOSES)
    • 31. IN WEB DESIGN...“What problem are we trying to solve?”
    • 32. IN WEB DESIGN...“What problem are we trying to solve?” SITES NEED PEOPLE
    • 33. IN WEB DESIGN... “What problem are we trying to solve?” SITES NEED PEOPLE +PEOPLE WANT INFORMATION
    • 34. IN WEB DESIGN... “What problem are we trying to solve?” SITES NEED PEOPLE OUR SITE NEEDS TO + = HELP PEOPLE FINDPEOPLE WANT INFORMATION INFORMATION
    • 35. OMG
    • 36. “How do people find information on the web?”
    • 37. Web Navigation
    • 38. JOHN’S AWESOME BAND Home
    • 39. JOHN’S AWESOME BAND Home AboutMusic Contact JAB
    • 40. JOHN’S AWESOME BAND Home AboutMusic Contact JAB
    • 41. JOHN’S AWESOME BAND Home Tour AboutLyrics News Music Contact Gallery Fans Store dates JAB
    • 42. Home page = summary
    • 43. JOHN’S NOT-SO-AWESOME BAND Home
    • 44. complex home page = complex summary =complex navigation
    • 45. complex navigation is bad for finding information
    • 46. Solution? Portals (Categories, galleries, etc.)
    • 47. JOHN’S AWESOME BAND Home AboutPORTALS News Music JAB Contact Fans
    • 48. Portals are “intermediate summaries”
    • 49. Hence... Help And Services Portal
    • 50. “But how do these portals work?”
    • 51. Information Architecture
    • 52. Information architecture is the organization of content (THROUGH CLEVER USE OF HEADINGS)
    • 53. “Why?”
    • 54. People are impatient.(They skim when they read on the web.)
    • 55. Examples of information architecture in ACTION
    • 56. 1 2 3INFORMATION ARCHITECTUREGOOD EXAMPLE
    • 57. INFORMATION ARCHITECTUREBAD EXAMPLE
    • 58. SummaryDesign = problem solving / achieving goals
    • 59. SummaryDesign = problem solving / achieving goalsWeb design: Users want to find information
    • 60. SummaryDesign = problem solving / achieving goalsWeb design: Users want to find informationProblem: How to get users to find information
    • 61. SummaryDesign = problem solving / achieving goalsWeb design: Users want to find informationProblem: How to get users to find informationProper use of navigation (e.g. portals)
    • 62. SummaryDesign = problem solving / achieving goalsWeb design: Users want to find informationProblem: How to get users to find informationProper use of navigation (e.g. portals)Guide user to scan portal via proper headings
    • 63. Help Portal
    • 64. Services Portal
    • 65. “Can we use the same solution fromHelp to solve Services’ problems?
    • 66. 1 2 4 3SERVICES PORTALNO, YOU CAN’T BE LAZY AND REUSE THE HELP PORTAL’S LAYOUT
    • 67. different content = different problem =different solution
    • 68. Caveats
    • 69. 1. Designs aren’t tested
    • 70. 2. Portals (while important) aren’t the answer; content is.
    • 71. Thus, as content writers... good design depends on YOU.
    • 72. Thank you!john.chan@ubc.ca@jtcchan