.png)
create.
-01.png){kind=small}
-02.png){kind=small}
: to make or produce something : to cause something new to exist
I have had a creative mindset since a young age. Whether it's building LEGO, sketching, photography, or designing, my life is filled with creativity. The following project is a blue sky creative visual design assignment. Zaptor is a simple user interface that connects people based on proximity using location services. I hope you like it.
Planning...
The planning for Zaptor began some years ago in a bar in downtown Vancouver. It evolved a lot in my head over the past 5 years, and I really wanted to at least get it out. I started with research on social media and chat apps to determine if there was a place for it in the market, some initial validation, and to gauge participants' feelings about location sharing. Then, a crazy 8's workshop with 4 participants was held to pitch the idea for viability and new ideas.
“A lot of times actually, when you need to book an UBER or order food then it’s okay, but to constantly tell people where you are at a given point of time seems a little un- comfortable”
- Survey Participant
75%
of Participants had felt that location services had made them feel uncomfortable in the past
It was clear that privacy and creating an easy way to shut the app on / off was critical to the user experience.
As the brand was an open book, I wanted it to have the fun feeling of a Space Laser Zapper. I put together a vision board of a few ideas to get me excited and started on the right path. A few logo concepts and brand elements were designed as a placeholder
Finally, the user journey was designed for the entire process, and then individual steps to ensure the flow of tasks and site hierarchy were established before designing any further.
Low-Fidelity Mockups
Based on the survey research and discussions with potential users, the following were key design decisions in the initial low-fidelity mockups:
-
Ensure privacy and safety are designed into the app
-
Instructional videos required to explain the use cases
-
The Zap button needs a gimmick
-
Let the user pick their favorite chat provider
-06.jpg)
-04.jpg)
High-Fidelity Mockups
I learned quickly that there was nothing simple about the app. it would require many pages and lots of data inputs to make it work.
- Lighter colors needed to be used
-
Menu navigation was important
-
Mapping and location filters are exciting features for small businesses
- Chat apps could be difficult to integrate without first connecting in-app
- Creating lists for filters, industries, categories, tags, etc is a big job
-03.jpg)
-07.jpg)
-05.jpg)
-01.jpg)
Mid-Fidelity
Mockups
In mid-fidelity, the focus was on ultra simple. No unneeded information or bells just a to-the-point connection app. for people and businesses.
Creating...
-02.jpg)
Testing...
Rainbow Spreadsheet Method
The first round of usability testing was carried out in person with participants. One computer was used to record the data, while a second computer was used to display the prototype. It was recorded and analyzed using the rainbow spreadsheet method. Key findings are listed below:
“Easy to follow. A bit long. Would prefer to finish registration process then do preferences."
- Participant #1
-
Reconsider the registration process and push set preferences to be set up after the user’s initial experience with the Zaptor Button.
-
Filters section of Zap-Map requires further work and testing
-
Explore adding a User Bio section to Connect Page
-
Explore Adding a link to the User’s connect page on the Zap-Map.
A-B Design Test
An A-B test was used to compare colour schemes, graphics, and layouts. The information collected helped make informed design decisions and bring the solution to life.
Maze Task Usability Test
Once the prototype was ready, a task-based usability test was created using Maze. The following action items were identified:
- Key functionality like the Zaptor button and the case study welcome deck were understood
- More instructions or a facilitator environment is still needed at this time
- Don't test confusing elements or things that need explanations you can't give. If you absolutely must, do it at the end so other questions are missed to do participant drop off.
-02.png){kind=small}
-01.png){kind=small}
-01.jpg)
-01.jpg)
