Mockup 4

Mockup 4 introduced a reimagined intro screen.

In our usability tests, we observed a behavior pattern that some users, especially international students, would skip through all welcome screens, not reading the copy text there. They mentioned that seeing so much information presented in their second language, it’s just not visually appealing. To address the issue, we redesigned the screens and made them into one intro screen, which shows only the most necessary information. We also reduced the amount of text and added more visual elements, as well as animations.

Another change was the introduction of title copy on cards. We added a title to both the “filter selection” card and “detail” card, to help users distinguish the two.

The Solution


After several iterations of the design and multiple rounds of user interviews and usability tests, we proceeded to create a high-fidelity interactive prototype of the app using Sketch.

The key navigation flow of the app, as shown in Sketch.

The image shows the key and desired navigation flow of the app. We have also created a video version of this demo. Upon opening the app for the first time, users are greeted by the intro screen, where they learn about the main functionalities of the app. Continuing to the main map view, they can view their current location and observe what’s around them. Other functions are also showcased in the image.

The Outcome

The high-fidelity prototype successfully addressed both the pain points described above as well as the user needs. Our solution enables the user to view relevant information that could enhance their personal safety, organized beautifully in an easily accessible mobile app that has an intuitive user experience, at at the University of .

The design received very positive feedback from the client, Cut to The . It also received praise from other teams during the Hack4Impact End of Semester Showcase. The project aims to use human-centered design principles to deliver an effective user experience for all users, especially those that are under emergency situations and need to find relevant information very quickly. Additionally, the design is scalable and can be applied to other cities. Hopefully, with our solution, students can walk home more safely at night.

Source link


Please enter your comment!
Please enter your name here