Discovery
The first three months were spent in discovery which included:
-
A comparative analysis to better understand how other libraries organized their complex information structures.
-
Gathering and chronicling business requirements from 6 five divisions within the library.
-
User interviews to discover how different people engage with the services and products that the library offers.
-
Documenting the user journey workflow with a click by click analysis of different paths to retrieving a resource.
Comparitive Analysis of 10 merged libraries
Gather and chronicle stakeholder requirements
Lead a team of students to conduct user interviews and draft personas
Aggregate the research into key takeaways and present findings to secure buy-in.
Document user workflows for retrieving digital resources and information through the website.
Before and after (a side-by-side)
Mount Holyoke Menu is built using a proprietary software application that controls food inventory, recipes, and the web presentation of meals for the day. Its importance lies in the fact that students reside on campus; therefore, depend upon this digital experience to make nutritious decisions. After doing an audit of the 133 digital products the college provides, I selected this as our first project.
Influence
Defining the Project Ecosystem
Once we completed our heuristic analysis, we prepared a digital slideshow to document the project approach, scope of work and key issues to present. This helped to neatly pitch our project to stakeholders around campus. In this presentation we included:
- Site type to guide the business requirements. For menu, we are working with a content source site which has
- New info daily
- Repeat visitors
- Browse and filter
- The outcome of our heuristic analysis including side by side comparisons of other organizations using the same menu software. This gave them a real example and showed them the possibilities.
- A tiered project model which demonstrated the different project outcomes with multiple approachs. This gave the stakeholders a clear baseline so they could gauge the return for each level investment.
I presented the proposal to key stakeholders from different campus divisions to pitch the benefit of the product upgrade. During the meeting, we received approval to move forward.
Presentation
Insight
Personas
-
18-26 (Insight: 100% have a mobile device and are comfortable with a mobile app interface)
-
Female / Identify as female (Insight: more concerned with caloric intake and nutrition}
-
Live & eat on campus (Insight: dining times are scheduled in tight proximity to class schedules – efficiency is critical)
-
Globally Diverse | 61 countries represented, “It feels like a sample population of the world, like little pieces of cities around the globe have migrated onto campus.” (Insight: English may not be their first language – using visual cues would increase instant recognition)
-
50% have allergens or dietary requirements (Insight: meals may be skipped or foods avoided due to a lack of access to ingredients – surface these next to each meal listed)
-
65% already use their phone to access the menu (Insight: regardless of the interface, students are still using their phone because that is their point of access – not a computer).
Interface
Prototype
Interaction Design
From our analysis, the main interaction design elements we wanted to improve were:
- Display / Placement of Hours: Move hours to the homepage so you don’t have to click through to each station to see when it’s open.
- Update existing iconography: This appeals more quickly to an international audience, creating visuals and removing the language barrier.
- Surface allergen icons: Allergens could only be found deep within the website architecture, making it hard to find. Furthermore, they had no “icon” unlike Dietary Restrictions.
- Legend: Create an Icon Legend and nametags so the interpretation of the images is discernable in case it’s not clear.
- Add the ability to easily compare options: Give the user the option to change stations and compare meals being served on the same day and meal period. Increases their likelihood of eating – more options. More efficient.
- Reduce Cognitive Load: Separate an entire day into meal periods to reduce the cognitive load of seeing all meals being served on one page (breakfast, lunch and dinner).
- Design an app: Give them an interface that feels like a native phone app when viewed on a phone. It’s more familiar. The purpose of a content site is to support quick and easy decision making by providing information in an easy to digest user interface. In a content site, the presentation and structure is consistent across most pages.
View Site: Menu
Click the images to view full screen.
Implementation
Translate design into well-crafted code
Insight
User Experience Research
We broke out our key performance indicators into tasks that could be clearly measured:
- Allergies / Dietary requirements - Is it accessible and easy to find/use?
- Visual Cues - Icons: is the meaning clear?
- Calories / Nutrition needs - Is it accessible and understandable?
- Search / refine search - how they use it / if they use it?
- Navigation - Easy to change date / change station / find dining services / return home?
- Device - Accessible and Usable on a phone / desktop / tablet
- Physical Data - Hours and Schedule information, Announcements - readable, easy to recognize
- Header and Footer - Considering the implementation of MHC content - will they use?
View Executive Summary
Metrics Analysis
User Behaviors and Takeaways
- Increased efficiency (ease of use): Time on page has been reduced by 73%
- Increased explorations (usability): page views increased by 2.6 times
- Higher satisfaction (pleasure): Session duration increased by 6.9 times and bounce rate decreased by 64%
Tasha Tudor and Family
Information architecture
UX design
Visual design
UI development
2016-2017 | Design and build an information architecture that unified an ecommerce platform, blog, recipe feed, and tours into a community-based, singular brand experience.
Jim Wann, Musician
Information architecture
Art direction
Visual design
UI development
2015-2016 | Design a prototype and custom template featuring a modular, mobile-friendly user interface that elicits a broadway sensibility. Craft a content strategy (imagery, IA, and text that underscores Wann's propensity for collaboration across the disciples of songwriting, theatrical production, and TV.
Apelon
Content strategy
Visual design
UI development
CRM integration
2015-2017 | Complete brand redesign to update a legacy site and graphic materials with the goal of making the content more accessible to key decision makers within health care organizations.