Classmates Portfolio

549 views

Published on

A few of the projects I worked on while employed by Classmates from 2001-2005.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
549
On SlideShare
0
From Embeds
0
Number of Embeds
9
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Classmates Portfolio

  1. 1. Jodene Eikenberry Information Architect/UX Designer Microsoft Ideo Hornall Anderson Design Works Vulcan Classmates Online HomeGrocer
  2. 2. Designing a content policing/reporting process for a social networking website Project Goals: • Create a mechanism to monitor site content utilizing members as reporters • Build a simple process to track reported content • Programatically “hide” reported content from site community (after specific criteria is reached) • Design notification, editing and appeal process for members with reported content
  3. 3. Community Policing Tool: Flow Chart of reporting process
  4. 4. Community Policing Tool: Link Placement Managing Business Owner Feature Request • Business Owner (a legal team member) requested that each UG content item (photo, bio’s and announcements) have a “report” link appended to it • My recommendation was a single link at the top of the page • UX concern driving my recommendation was maintaining the primary purpose of the page (viewing a profile, reconnecting). Adding a slew of “report” links would clutter the page and create an unfavorable experience that content was there to be reported on.
  5. 5. Community Policing Tool: Report Page Design Strategy • Single page aggregates all user- generated content items •User initiated “reporting” task is thus met by a page designed specifically for this purpose •Page provides user with a “one stop shop” for reporting multiple content types from one screen (if necessary) • Reporters may report an item only once, so page provides feedback regarding items previously reported
  6. 6. Community Policing Tool: Final Page of reporting process
  7. 7. Community Policing Tool: Reported User’s “Action” page Tagged Content Items • User’s profile clearly shows that specific items have been hidden from the community • User can choose to remove or replace the reported content item, or click the “learn more” button to file an appeal with member care.
  8. 8. Community Policing Tool: Reported User’s Appeal Form
  9. 9. Redesigning the Classmates Profile page: Improving a core site page while working with some challenging UX business drivers • Profile page, a primary page for gathering and displaying UGC had not been updated in several years. • New profile page would act as a teaser to gather more UGC as well as drive paid subscriptions. • Unpaid members would be forced to build their own profile before viewing a limited version of another members content. • Only subscribers would be able to view a full profile
  10. 10. My Profile Page Redesign: Profile Page Business Drivers Business Drivers = UX concerns • the profile page would act as a “teaser” to both generate more UGC and drive paid subscriptions. • non-subscribing members would be forced to build their own profile before viewing a limited version of another members content • this page’s purpose was to communicate to the user why they were beginning a process they didn’t know they’d initiated • I was unable to persuade the product manager to add a “back” button or link
  11. 11. My Profile Page Redesign: More UX concerns Profile building process • Q&A divided into 4 pages, to maintain maximum white space and prevent excessive scrolling •Headers defined each pages Q&A focus •Choose not to include a process timeline, believing that users might be scared off if they knew there were 5 pages in the process
  12. 12. My Profile Page Redesign: Paid and unpaid final views • design incorporated extensive conditionality around member status and user-generated content; page layout conditionally shrinks or expands depending on content types
  13. 13. My Profile Page Redesign: Phase 2 Redesign Design Drivers • this design needed to incorporate new categories of profile information • the tab system was used to allow the user access to all profile categories “above the fold” • page designed to keep the first line of bio content above the fold • page again designed to incorporate layers of conditionality depending on profile’s content types Page contributed to a 188% increase in user-generated content and $772,412 in additional revenue in the first 60 days post-launch
  14. 14. Redesigning Classmates Navigation: Designing a new navigation concept to increase business drivers AND improve the UX • Six week project to radically redesign the Classmates global and local/contextual navigation • One brief round of usability • Design needed to scale for several years of business unit growth • UX goal was to provide quick and intuitive paths to users’s primary pages (various directory pages, profiles, user accounts, help, etc.)
  15. 15. Navigation Redesign: Original Design Design Challenge • the original Classmates navigation system revolved around four primary categories on the left, only two of which drove substantial revenue • “Friends” was a poorly labeled aggregate of two primary business units and revenue drivers - high schools and military listings • Engagements drivers (the local navigation) were not visible unless the header was clicked • More business units were to be added in the next 2 years
  16. 16. Navigation Redesign: The Navigation Solution Design Factors • given six weeks to complete this important project, I chose to focus energy on information architecture and let the design follow industry standard concepts • the navigation scheme promotes all the affiliation directories to a global level • local navigation for the home page is “open” and displayed upon entering the site, allowing the user to view available secondary options without clicking • the design was scalable to allow for the growth the company had planned for the next two years (see below)
  17. 17. Navigation Redesign: The Dashboard Redesign Design Concept • the original dashboard unnecessarily occupied two columns of real estate and was only viewable on the homepage • I redesigned the dashboard as a single column structure that provides one click access to the user’s affiliations as well a “new member” count • one column design allowed the dashboard to be persistent to the far left column of all directory home pages • links to additional affiliations from our growing community base are available directly below schools • the growing popularity of contextual advertising links are promoted in a separate area below
  18. 18. Class List Redesign: The Most Important Page on the Site Problems • classmates names often appeared below the fold at 800x600 • no system of list filtration (except by year) • “previous/next” links did not allow user to drill deeper into the list • users could only view a single year at a time • promotions took up precious real estate and were not integrated into a page system • alumni ”total” count did not reflect class year represented • tertiary nav difficult to see/find
  19. 19. Class List Redesign: The Most Important Page on the Site Design Factors • introduced tabs to filter list by roles • incorporated dropdown menus into tab base for allowing list to be sorted by year ranges • added pagination at top and bottom of page • built a row into the list for contextual advertising • made tertiary navigation easier to see by building in more white space • promotional space incorporated into two modules at top of page separated from list content by orange header bar

×