Information Architecture: Part 2           Class #1               Keith Schengili-Roberts Copyright © 2013, The iSchool In...
Welcome & IntroductionInformation Architecture: Part 2                 Competitive Analysis           Class #1            ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & Introduction  Information Architecture: Part 2                Competitive Analysis             Class #1         ...
Welcome & Introduction Information Architecture: Part 2                 Competitive Analysis            Class #1          ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & Introduction    Information Architecture: Part 2                Competitive Analysis               Class #1     ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                 Competitive Analysis           Class #1            ...
Welcome & IntroductionInformation Architecture: Part 2                       Competitive Analysis           Class #1      ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #1             ...
Welcome & Introduction    Information Architecture: Part 2                 Competitive Analysis               Class #1    ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #1           ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #2             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #2             ...
Welcome & IntroductionInformation Architecture: Part 2                  Competitive Analysis           Class #2           ...
Welcome & IntroductionInformation Architecture: Part 2                 Competitive Analysis           Class #2            ...
Welcome & Introduction Information Architecture: Part 2                Competitive Analysis            Class #2           ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #2             ...
Welcome & IntroductionInformation Architecture: Part 2                Competitive Analysis           Class #2             ...
Welcome & IntroductionInformation Architecture: Part 2                  Competitive Analysis           Class #2           ...
Upcoming SlideShare
Loading in...5
×

Information Architecture Course Part 2 - Spring 2013 - Class 1

1,394

Published on

An example slide deck for the Information Architecture (Part 2) course I teach at the University of Toronto's iSchool program.

0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,394
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
16
Comments
0
Likes
5
Embeds 0
No embeds

No notes for slide

Transcript of "Information Architecture Course Part 2 - Spring 2013 - Class 1"

  1. 1. Information Architecture: Part 2 Class #1 Keith Schengili-Roberts Copyright © 2013, The iSchool Institute Information Architecture: Part 2
  2. 2. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Instructor Keith Schengili-Roberts keith.schengili-roberts@utoronto.ca Class #1 January 24, 2013 Keith Schengili-Roberts Copyright © 2013, The iSchool Institute Information Architecture: Part 2
  3. 3. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Today’s Class • Administration / Introduction • Competitive Analysis (with in-class exercise) • Paper Prototypes (with in-class exercise) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  4. 4. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books• The following is a selection of IA-related book titles that have proven to be useful Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture for Information Management
  5. 5. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books (Cont.)• Recommended Text #1: Information Architecture for the World Wide Web, 3rd Edition by Louis Rosenfeld & Peter Morville(The “Polar Bear” book) O’Reilly & Associates, 2007Cover price: $51.99 (though street price is lower, especially online)Encapsulates much of what is taught in this course; excellent reference work2nd Edition available on Google Books, most recent version available via Toronto Reference library Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture for Information Management
  6. 6. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books (Cont.)• Managing Enterprise Content, by AnnRockley and Charles Cooper (2012)The first edition of this book came out in2003, and launched the idea of “ContentStrategy”, looking at how informationought to be organized within Enterpriseenvironments. Second edition takes this inthe mobile era.List price: $41.99, though available muchcheaper onlineWatermarked eBook/PDF version ~$22.39 Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture for Information Management
  7. 7. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books (Cont.)• Understanding Comics, by ScottMcCloud (1993)“More than just a book about comics, thisgets to the heart of how we deal withvisual languages in general.” Lou Rosenfeld, President of the Argus Center for Information ArchitectureTerrific book for helping IAs understandhow people process visual information;good for use in icon design, how peopleread web pages, and other visualelements Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture for Information Management
  8. 8. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books (Cont.)• The very latest book from Jakob Neilsenand associates: Mobile Usability (2012)List price: $36.99Watermarked eBook/PDF version ~$22.39.“How do we create a satisfactory userexperience when limited to a small device?This new guide focuses on usability formobile devices, primarily smartphones andtouchphones, and covers such topics asdeveloping a mobile strategy, designing forsmall screens, writing for mobile, usabilitycomparisons, and looking toward thefuture.” Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture for Information Management
  9. 9. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books (Cont.)• Recommended book: Ambient Findability by Peter Morville (2005)Subtitle: What We Find Changes Who We Become“Morville discusses the Internet, GIS, and other network technologies that are coming together to make unlimited findability possible. Morville looks back at the history of wayfinding and human evolution, suggesting that our fear of being lost has driven us to create maps, charts, and now, the mobile Internet.”A key book that explores how humans seek information within their environment Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture for Information Management
  10. 10. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books (Cont.)• Pervasive Information Architecture by Andrea Resmini and Luca Rosati (2012)• Arguably a modern successor to the “Polar Bear” book• Looks at how IA has become a necessity in designing “information ecosystems” as people need better wayfinding tools• Also talks about how IA plays a role in the creation of cross-channel experiences, where the virtual increases merges with the physical world Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture for Information Management
  11. 11. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books (Cont.) Web 2.0 Architectures: What Entrepreneurs and Information Architects Need to Know, by Duane Nickull (2009) “Web 2.0 Patterning” section in particular is useful Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  12. 12. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Essential IA Books (Cont.) Web Style Guide, 3rd Edition, by Patrick J. Lynch and Sarah Horton Available in print and online at: webstyleguide.com Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  13. 13. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes The “Other” Book• You have been handed a “book” containing all of thepresentation material to be used in this course• Main sections are divided up by class• A version containing “Extra Reading Material” will beavailable for download by the end of the course• I will be changing/updating some items along the way toreflect particular class interests that can’t be anticipatedprior to the “book’s” publication. Change is good. ;-) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  14. 14. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes More Admin Stuff• Copies of the presentation deck for each class andrelated materials will be made available at the followingWeb site: www.infoarchcourse.com• Go to “Course Files” page and download the zip filescontaining the course materials Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  15. 15. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Who is this guy? Keith Schengili-Roberts • Author of “Core CSS, 2nd Edition” (2003) and 3 previous technical titles • Started as a professional Webmaster in 1995, some early examples: Delrina, Cyberjack, Symantec • Consultant for Mekon, working on Information Architecture, Content Management and related issues for clients world- wide • Consultant with Mekon, advising clients on CMS deployments • Formerly the Information Architect and then Manager, Documentation & Localization at AMD • Instructor at FIS since 1999; have taught/currently teach: • “Information Architecture: Part 1” • “Information Architecture for Information Management” • “Enterprise Content Management” • “PHP and MySQL Web Development” Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  16. 16. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes What I Do What I work on as an Information Architect/Content Strategist/Consultant: • Aid firms moving from unstructured to structured content • My specific expertise is in DITA XML (industry blog: www.ditawriter.com) • Advise clients on the best CMS for their needs; advise their IAs and Writers on Best Practices • Work on the Return on Investment (ROI) that can be expected • Was keynote speaker at Content Management Strategies 2012, and an invited speaker to the Information Architecture Colloquium in Lyon, France Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  17. 17. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Teaching Philosophy• Plan is to introduce you to some new ideas, with theintention of making you re-think how you currentlyimplement Information Architecture in practice• Teach for real-world applicability• People learn best by doing, and by sharing their ownexperiencesEnd goal: provide some fundamentals for the work most ofyou are likely already doing Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  18. 18. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Timetable for ClassesClass Timetable:• Thursday January 24th, 6:00 - 9:00 p.m. (Class #1)• Thursday January 31st, 6:00 - 9:00 p.m. (Class #2)• Thursday February 7th, 6:00 - 9:00 p.m. (Class #3)• Thursday February 14th, 6:00 - 9:00 p.m. (Class #4 - Student Assignment #1 due)• Thursday February 21st (No class, but Assignment #2 due) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  19. 19. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes IAs are Typically Wearers of Many “Hats”• In my experience the IAs I teach are those who may or may not have “IA” as part of their official title, but do the equivalent work• Also, most IAs have never had any formal training in the art and craft of IA, which is where this course comes in• I see my role as instructor in part to teach you the fundamentals and give you the tools necessary to better do the work you are likely already doing Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  20. 20. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes I.A. Deliverables for the Web• Content Inventory (“Content Survey”, “Content Audit”)• Competitive Analysis• Usability/Accessibility analysis/recommendations• Personas (“User Profile”)• User Scenarios (“Use Case”, “Task Analysis”, “User Flow”)• Sitemap (“Site Hierarchy Map”, “Site Diagram”, “Blueprint”)• Wireframes (“Page Architecture”, “Page Schematic”)• Style GuideSome examples: www.gdoss.com/web_info/information_architecture_deliverables.php Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  21. 21. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Rough Course OutlineClass 1 Class 3• Competitive Analysis • Social Architecture• Paper Prototypes • Web 2.0 DesignClass 2 Class 4• How to Make a Wireframe • Creating a Web Style Guide• Web Accessibility • Icons and Expression in Design • Localization 101 Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  22. 22. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Goals• By the end of this course you should have a good theoretical basis in the basics of Information Architecture• Should have the tools necessary to methodically tackle the redesign of any Web site/content• Both the “Basic” and “Advanced” courses mix instruction with plenty of hands-on examples• Will have time to work on parts of assignments in class Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  23. 23. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Grading• Assignment #1: Creating a before/after wireframe for a Web site of your choice (40%)• Assignment #2: Usability assessment of a Web site (40%)• In-class participation: 20% Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  24. 24. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes IntroductionsPlease introduce yourself to the class:• Why are you interested in Information Architecture?• What do you hope to get out of this series of classes Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  25. 25. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes What I Am Looking for in the Assignments• Bringing together concepts and techniques that have been learned over the course• Being able to identify theoretical approaches and why they have been incorporated (or why they haven’t)• Demonstrating how your new approach will improve upon the old (i.e. “Before and After” approach works well)• Having done the work – the time invested in your project should be evident in your project Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  26. 26. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Assignment #1• Create a “Before” and “After” wireframe of website of your choosing.• Should present: home page; second level and third level page layouts• Goal is to a) identify existing issues/problems, and b) present a new version which will improve upon the current design• Can be done as a group assignment• Format 8-10 written pages (including screenshots)• When Due: February 14th 2013 (Final class) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  27. 27. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Assignment #2• Do a usability/accessibility assessment of a website of your choosing• This should not be an exhaustive critique of every single page on the site; rather, focus on pervasive issues/problems that you find• Dont forget to include whatever is good from a usability/accessibility standpoint!• Format 8-10 written pages (including screenshots)• When due: February 21st (Thursday after the final class) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  28. 28. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Competitive AnalysisThe importance of research:"Borrowing good ideas, whether they come from competitors, friends, enemies, or strangers, comes naturally to all of us. It’s part of our competitive advantage as human beings. If we were all left to our own devices to invent the wheel, most of us would still be walking to work." Rosenfeld and Morville, 2nd ed., p.225 Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  29. 29. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Competitive Web Site Analysis• Provides insight/perspective as to what your competitors are doing online• Can determine what they are doing effectively/not effectively• Can help you determine what you are not doing effectively• This need not apply only to businesses (i.e. applies to public / non-profit sector as well Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  30. 30. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes What You Need to Know• Understand the competition• Build domain knowledge• Identify best practices (specific to the domain) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  31. 31. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes What to Look For• See trends within industry; provides understanding of what industry users are used to seeing• Start with known rivals• Look for other sites with similar features, even if they are in a completely different industry• One possible good source: Webby Award Winners: www.webbyawards.com/webbys• Use analyst reports to document industry trends• Ensure you are not copying a bad thing. Just because it is a reputable company doesn’t mean it is a good website. Use your own judgment.• List findings in a spreadsheet Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  32. 32. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Specific Things to Seek Out• Look-and-Feel / First impressions• Search engine optimization/ranking• Keyword list• Is in-depth info available on firm/product?• What is their focus/who is their audience?• How does their focus differ from that of the target Web site? Are there good ideas that could be “borrowed” Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  33. 33. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Be Systematic• Do an inventory list of supported features between sites.• What is their labeling scheme/taxo nomy? (Is there one?) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  34. 34. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Heuristics that Can Be Applied • Efficient Navigation • Effective Visual Design • Organizational Clarity • Supporting Readability & Scannability • Clear Labeling • Facilitating User Tasks • Consistent Design • Matching User • Providing Help Expectations This is a sub-set derived from Nielsen’s usability heuristics (www.useit.com/papers/heuristic/heuristic_list.html) and principles of Interaction Design (www.asktog.com/basics/firstPrinciples.html) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  35. 35. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes One Example: InnocentDrinks.co.uk• "We tried to make everything say instantly that the product is fun and good for you” • Content: They offer a friendly impression of themselves with a highly personalized backstory. • Visuals: They employ a simple looking layout, friendly fonts and rounded shapes along with bright, fresh colours and imagery. • Writing Style: Perhaps the most recognizable feature of their brand. They do not capitalize their headers, and offer users the chance to be ‘part of the family’. This example taken from: http://www.nicolacampbell.com/content-management/extended-blog.pdf Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  36. 36. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes One Example: InnocentDrinks.co.uk• Here’s what they came up with: Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  37. 37. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes One Example: InnocentDrinks.co.uk• Compare that to this (www.getfreshjuice.co.uk/): Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  38. 38. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes One Example: InnocentDrinks.co.uk• Compare that to this (fruitapeel.co.uk): Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  39. 39. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes Sample Competitive AnalysisCDNow: Available as a PDF from the infoarchcourse.com site at www.infoarchcourse.com/files/competitive_analysis-CDWorld.com.pdf; derived from an article at: www.boxesandarrows.com/view/competitive_analysis_understanding_the_market_context Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  40. 40. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #1 Paper Prototypes In-Class “Competitive” Analysis• Track down competitive websites (at least 2 - 4) within a single domainWhat to look for:• What features (e.g. search (good), background music, (bad)) do they have on their Web site that yours does not? Is it of real benefit to a user?• Do a basic usability analysis: try finding a product/piece of information on the competitor’s Web site and compare how easy it was to find (or not find)• Is the design consistent? What’s your first impression? Are the labels used clear? Can you navigate the site easily?• Other factors to check: keywords used, relative readability rating, Google ranking, etc. Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  41. 41. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #2 Paper Prototypes Paper Prototypes Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  42. 42. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #2 Paper Prototypes Wireframes• Sometimes called “prototypes” or “mockups”Why do it?• Web site wireframes are easier and cheaper to correct than a mockup of a released Web site.• Low-fidelity wireframes are quick, cheap, and designed to elicit user feedback as early as possible• High-fidelity prototypes usually involve coding, but are better for evaluating graphics and getting buy-in that usability problems found during testing are not due to the rough quality of the prototype. Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  43. 43. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #2 Paper Prototypes “Low-Level” Mockups/Paper Prototypes• Can be done with paper/sticky-notes• Sketch out areas of interest, such as: • Logo • Search • Navigation elements • Area of user’s focus • Footer elements Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  44. 44. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #2 Paper Prototypes Paper Prototyping How To• Create interface elements/navigation links on sticky notes and place them on a surface to emulate a computer screen.• Test the arrangements with a sample user: ask them questions and see how they react and what options they choose• Vary the sequence of dialogs on the fly, which makes it easy to test multiple versions of an applications interaction design. Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  45. 45. Welcome & Introduction Information Architecture: Part 2 Competitive Analysis Class #2 Paper Prototypes When to Use Paper PrototypingPaper prototyping lets you conduct informal usability tests with real users early in the project, before the design is cast in concrete code. Here are six signs that your project could benefit from paper prototyping.• There are many different ideas about the design.• You find yourself defending a particular design.• There are parts of the design youre unsure about.• You are changing the way that the users perform a task.• The concepts or terminology are new to the users.• You are feeling uncreative.Derived from Carolyn Snyders article at: today.java.net/pub/a/today/2003/12/23/sixSigns.html Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  46. 46. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #2 Paper Prototypes Paper Prototyping: What to Concentrate On• Work on navigation labels and their placement• Think about planned-for functions (i.e. search, shopping cart mechanism, etc) and use a simple label to promote them• Where possible, substitute a text label where a graphic might be expected to appear (i.e. write “logo” on a sticky note instead of trying to redraw it)• Work only on pieces you are most interested in; do not concentrate on minutia (i.e. copyright info, etc. at bottom of a page can be summarized) Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  47. 47. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #2 Paper Prototypes Further Reading on the Topic• There is an entire book devoted to the subject…• Available on Google Books at: http://books.google.ca/book s?id=5OhE7dyGtmgC&print sec=frontcover&dq=Paper+ Prototyping&ei=Z74LS- GeD52wNICY3W0#v=onep age&q=&f=false Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  48. 48. Welcome & IntroductionInformation Architecture: Part 2 Competitive Analysis Class #2 Paper Prototypes In-Class Exercise (Part 1) – “Low Level” Usability TestCan easily use this method to do a quick mock-up a Web site, and test itYour task:• Your team creates a mockup of your target Web site (Home Page only)• Come up with a description of 2nd level pages (i.e. link name and 1- sentence description of its contents)• Once done, get someone from another group and test the redesign on them • Ask that person questions on where they would click to find out specific information • Is the behaviour from the user what you expected? If not, change label/placement/etc. until it makes sense to the user• Photograph the final results, which can then be fed into the design for the “after” wireframe for the target site Keith Schengili-Roberts Copyright © 2013, The iSchoolProcter Katherine & Scott Institute Information Architecture: Part 2
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×