Your SlideShare is downloading. ×
Remember the User: Storing and Sharing User Information in a User-Centered Design Organization
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

Remember the User: Storing and Sharing User Information in a User-Centered Design Organization

1,232

Published on

The "Remember the User" project was my final internship for the User-System Interaction (USI) program at the Eindhoven University of Technology (TU/e). For it, I designed and evaluated an …

The "Remember the User" project was my final internship for the User-System Interaction (USI) program at the Eindhoven University of Technology (TU/e). For it, I designed and evaluated an browser-based application for storing and sharing user information for the design department at Océ. The project took nine months, and here is the presentation I gave at the end.

Published in: Design, Technology, Business
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,232
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
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
  • The idea: a shared vision of reality (users) for Océ user advocates.
  • The project is intended to support three activities:Storing user informationSharing that user informationRecruiting user test participants
  • Idea: Intranet-based, browser accessible information system.Why? Access: From anywhere inside R&D From any computer Rich media capability (videos, photos, etc.) Wikis also follow these criteria, but more on that later
  • Next big questions:What form will the information take?What can system users do with it?Basic unit of information, like a single database entry, each with its own attributes (variables)
  • ACTIONS:Based on typical CMS paradigm, except for timeline view (context requirement)
  • Four entry points to accommodate different retrieval methods:Browse for exploration,Search bar for directed search,Latest activity and tag cloud for reactionary retrieval
  • Lightweight keyword search; keywords can be added and deleted at will to display different results
  • Each node has a detail view that shows all the information in one node on one screen.Detail view consists of an image and title to basic information to details and rich media to socially connections to other resourcesThis persona, for example, has three images attached in this slideshow.
  • Timeline view was intended to put nodes into context, where one can see what has gone on in the time leading up to a node’s creation.
  • The idea was to make the system in Drupal, because the CMS’ extensibility and security lends itself to this kind of exchange system. As such, I built a crude prototype in Drupal with the information architecture and experimented with some of the Drupal modules available.
  • Same entry pointsOcé corporate styleNow with global navigation on sidebarSearch is on left to accommodate mental model and center stage design pattern
  • Some background information on these questions:The portal features three main entry points to the content: “Browse” by node type, “Search” as a search box, and the tag cloud. I wanted to see which of these people used the most and why.Drupal has the exciting feature of easily exporting its content to PDF or into XML format. I wanted to leverage this in such a way that people could use the export function to export nodes and such as plain text for easy copy/pasting into reportsAs it is now, Océ R&D uses wikis to upload and share user information. I wanted to highlight one of the advantages of this system by showing that Odea’s Web2.0-style upload form is much easier to use than a wiki upload form. Also, I incorporated some new behavioral and layout elements into this iteration of the design; were they good ideas?
  • More info on what came out of the think-aloud study:People found the “Browse” section to be inviting, and that was the natural entry point for most participants.The export function was received well, but the participants would have liked it to be better integrated into their existing reporting systems.Participants definitely found the upload form to be better than that of a wiki.In general, the layout and behavior was received well, but participants felt that each page was too cluttered, there was no apparent hierarchy in the content types, and it would be useful to be able to retrace your own steps while using Odea.
  • I experimented with different variations on displaying search results. Designers, who tend to be visual thinkers, preferred the graphical display, but with the caveat that it must be made more useful and usable by incorporating more information into the display. I presented the three variations printed in color on paper at the same time and asked participants which they preferred and why. One of the participants, a programmer, immediately pushed away the graphical display sheet and exclaimed, “not this one!”
  • I experimented here with different ways to make system users feel more like there is a dialogue going on with Odea, in order to engender an affective, emotional response by making Odea seem more like a being than a lifeless system.Some (male) participants preferred the variant featuring the woman’s face, but most felt that the extra page content cluttered the layout and did not feel any emotional response. They would tolerate the extra “clutter” if the information were useful, however.
  • New Start Page:More standard separation between the left menu bar and right content area. Actions taken on the left will manipulate content on the right. This strengthens the center stage design pattern.I incorporated two new things above the content area, on top is a breadcrumb navigation row that shows the last pages visitedThe second is a command button row that displays commands contextually, providing feed-forward to make it clear what the system user can do with what s/he sees in the content area.Content displayed more modularly, to help system users distinguish which things belong together.The icons incorporate color coding to subtly show content hierarchy and distinguish node types in search results.I added a random quote generator to the start page as an affective element. It is less emotional, but useful and appealing to system users.
  • New Node Page:The layout is modified to make more clear what is the node and what is extra content (comments, links to other nodes, etc.)Notice the command buttons on top are different for the node page: these are the commands available for the node context
  • New Node Page:3. The extra information is now positioned in such a way that it accommodates infinite numbers of entries by allowing scrolling. This lets the layout breathe by allowing extra vertical space for positioning bits of content while making the visual hierarchy statement “this content is less important than the node content.”
  • New Search Results:The left menu bar is now dedicated to a flexible search mechanism that allows system users to input keyword filters and delete them in a lightweight and non-intimidating way.Node entries themselves are grouped into their categories with icons depicting which node type they are at a glance. Less text is shown per entry, only search-relevant informationNode entries are also made more visual through giving each one its own box. The gradient background invites clicking, supporting the affordance that clicking anywhere within the box takes the system user to the relevant node page.The contextual commands here support text participants’ mental models that the search results are actually a “node center” where they can perform all node-level actions. This was not supported in the previous iteration.
  • Note: DocFinder is the automated report generator used by Océ.
  • Here is a cost/benefit diagram showing how Odea could affect the organization during its development and adoption cycle.1. During the development phase, it costs resources for making the first steps. There is little benefit, as Odea cannot yet be used.2. Once the framework of Odea is in place, the user information gathered before Odea must be input into the system. This is relatively thankless work until it is completed. 3. Once all the information is in Odea, it finally becomes useful. The only effort required to maintain the system is each individual’s effort in adding new content. This is frequent, non-intensive work, and the burden of maintaining the content is spread across all who use it.4. If changes need to be made, implementing them will cost more time and resources, but once that is finished, the overall benefit increases and overall cost will either go back to “normal” or decrease, depending on the changes made.
  • Iterations…..
  • Peace of mind; concentrate on design
  • Transcript

    • 1. Remember the User
      Brian Pagán
      Eddy van Vliembergen
      AbbieVanhoutte
      Jacques Terken
    • 2. Shared vision
    • 3. Store
      Recruit
      Design
      Research
      Evaluate
      Build
      Share
    • 4. Design
      Research
      Evaluate
      Build
    • 5. 40 Semi-Structured Interviews
      User Information:
      What? 71 Types of information
      How? 4Models of exchange
      &
      3. 52 spontaneous statements by interviewees
      Design
      Research
      Evaluate
      Build
    • 6. Current Information Exchange Models
      Design
      Research
      Evaluate
      Build
    • 7. Design
      Research
      Evaluate
      Build
    • 8. Design
      Research
      Evaluate
      Build
    • 9. First Ideas
      Design
      Research
      Evaluate
      Build
    • 10. Many-to-Many, Dynamic
      • Odea and wikis
      • 11. Information control at recipient
      • 12. Digital = searchable
      • 13. Dynamic information
      • 14. Two-way information flow
      Océ Odea
      Design
      Research
      Evaluate
      Build
      New information exchange model
    • 15. Odea Info Architecture
      Design
      Research
      Evaluate
      Build
    • 16. Odea Flow
      Timeline View
      Search Results
      Search
      Open Node
      Design
      Upload Form
      Research
      Evaluate
      Node Page
      External Resource
      Start Page
      Submit
      Create
      Build
      Open Node
      Link
      Browse
      Node Directory
    • 17. Start Page
      Design
      Research
      Evaluate
      Build
    • 18. Search Results
      Design
      Research
      Evaluate
      Build
    • 19. Node Page
      Design
      Research
      Evaluate
      Build
    • 20. Timeline View
      Design
      Research
      Evaluate
      Build
    • 21. Design
      Research
      Evaluate
      Build
    • 22. Expert Review
      Use Case Run-Through
      = 6
      Design
      Research Questions:
      General Impression
      Perceived utility
      Graphical node display for search results?
      Research
      Evaluate
      Build
    • 23. Expert Review
      Use Case Run-Through
      Design
      Research Questions:
      General Impression
      Perceived utility
      Graphical node display?
      But:
      Who’s going to fill it?
      Only useful with proper adoption
      Timeline view not useful
      Answers
      Clear, but no nav
      Potentially
      Not bad
      Research
      Evaluate
      Build
    • 24. Design
      Research
      Evaluate
      Build
    • 25. Drupal
    • 26. Start Page – Next Design
      Design
      Research
      Evaluate
      Build
    • 27. Design
      Research
      Evaluate
      Build
    • 28. User Test
      Think-Aloud Trials & Debriefing
      = 9
      Design
      Research Questions:
      Portal entry points?
      Export useful?
      Upload form?
      Layout & behavior?
      Research
      Evaluate
      Build
    • 29. User Test
      Think-Aloud Trials & Debriefing
      Design
      Research Questions:
      Portal entry points?
      Export useful?
      Upload form?
      Layout & behavior?
      Answers
      “Browse” inviting
      Yes; better integration
      Better than a wiki
      Zen, hierarchy, history
      Research
      Evaluate
      Build
    • 30. Video Snapshots (Morae)
      Design
      Research
      Evaluate
      Build
    • 31. Search Results - Variations
      1. Single-Column Textual
      Design
      2. Tri-Column Textual
      Research
      Evaluate
      Build
      3. Graphical Tag Web
    • 32. Start Page – Affective Variants
      1. No affective elements
      Design
      2. Textual question
      Research
      Evaluate
      Build
      3. Textual question with face
    • 33. Design
      Research
      Evaluate
      Build
    • 34.
    • 35.
    • 36.
    • 37.
    • 38. Design
      Next Questions:
      Which exact variables per node?
      Results view good?
      Contextual action buttons good?
      DocFinder Integration?
      Research
      Evaluate
      Build
    • 39. Further steps:
      Design
      Development
      Adoption
      Design
      Research
      Evaluate
      Build
      Benefit
      Cost
      Dev
      Filling in
      First Use Cycle
      After Possible Changes

    ×