Project Scope

‍

Create an interface prototype that can be used as though it were part of a functioning system. Use and learn Figma to create an interactive experience that behaves much like a working system.

Client: Drexel University

My Role: UX Designer, Researcher

Team: Drexel University - Prototyping - Team of Three Graduate Students

Timeframe: 4 weeks

Methods: User interviews, low-fi prototyping, process mapping, functional prototyping

Tools: Figma, Miro, Stormboard, Microsoft Teams

‍

My Role

‍

Facilitated early research and synthesis (interview questions, analysis)

Co-developed experience strategy and mapped user journey

Created prototypes in Figma and led usability testing

‍

Process

The design process began by defining the average user and the obstacles they face when planning a trip to the Zoo. The team brainstormed by gathering ideas and thoughts of our users. We used Stormboard, an online collaborative workspace tool to conduct our brainstorming exercise. We took time to understand various aspects of the average user such as who they are, their unique needs and goals, and the challenges they encounter. We decided to focus on families and the experience of trip planning for parents of small children. These users want a stress-free experience and easy interactions. It also gave us ideas to include in the functionality, such as big buttons to make multi-tasking easy.

‍

After agreeing we would focus on the parent user persona, we moved on to the next phase, mapping the journey. We used Miro to create a flowchart to map out the steps needed to complete an online ticket purchase in conjunction with browsing exhibits and events. Miro helped us define the granularity of the checkout process so we knew how many wireframes we would need and the purpose of each of them. We used the flowchart to divide wireframing tasks between team members and produced wireframes that would allow the user to complete an online purchase.

‍

‍

We then created mid-fidelity wireframes using Figma. This facilitated a discussion about the must have features and interactions, and affirmed that our solution was viable.

‍

The next part of the design process was to receive feedback from potential users to evaluate our designs and refine our concepts to best fit the needs of users.

‍

Discussion

‍

Feedback

‍

We collected feedback on our prototype that we were able to implement in a further iteration by conducting interviews with six participants. We selected participants based on our target demographic. Other suggestions we noted as a next step to take beyond the scope of this project. Our interviews revealed that while parents want to encourage unstructured outdoor play, they want transactions and information-gathering to be seamless and easy to use. For example, a mother with two children that we interviewed suggested we add a page with the option to either find more information on a particular event or make an online ticket purchase while browsing the Exhibit page.

“It would be good to know more about Tommy to decide if I want to get tickets.”

User Tester, referencing Lemur Event on the homepage

‍

Based on the feedback above, we revised the call to action for that event from “Get tickets” to “Learn more.” We made this change to ensure users do not feel pressure to purchase when they click that button. The button leads to a screen which provides details about the event, aligning with user expectations for a “Learn more” button.

‍

We also received positive feedback about the content of the app. According to preliminary testing, we succeeded in creating the upbeat, family-friendly look and feel that we targeted with our color palette, imagery, and copy.

“Cute! All of this feels good for a mom. ‘Nose-to-beak’ is kid-friendly.”

User Tester, referencing the Exhibits page

‍

Final Deliverable

‍

The final stage was to make adjustments based on usability testing and bring our wireframes to high fidelity. We implemented a color palette based on Material Design that would create the upbeat look and feel we wanted to convey for the zoo. Our imagery and color palette were chosen to complement and support the content and resources users are seeking online.

Interact with the prototype

‍

Next Steps

‍

Next steps include further testing in a real-world context to understand where The Wild Zoo is meeting user needs and where there are still pain points. Further testing would include validating the concept by testing the prototype with families on-site (at the zoo). We would also explore a content management system so zoos could tailor experiences to seasonal exhibits or local species.

Further iterations will include advanced features such as an interactive zoo map to provide directions based on user locations, ability to view average wait times for exhibits, events, food courts, and restrooms to eliminate unwelcome surprises.

‍