web design, mobile design, graphic design, front-end dev, ux writing, quality assurance
I was asked to work on an exciting new mobile app and help them solve the problem of bringing mental health to the Middle East region.
I said yes, and I started working with Tuhoon on a one-off project, then I joined them as a part-time consultant to help shape their design.
Brand thinking
Since I’m the first designer that joined Tuhoon, I took the responsibility to think of the Tuhoon brand and what we need now and in the future.
I worked on the following diagram in FigJam and discussed it with the team to keep them in sync.
From there, we started working on the app’s MVP to see how things will go. Read more in the following section.
UX writing
Building the mobile app MVP
As a first step, our goal was to explore the product MVP and how we can deliver the minimum and most useful experience to the end user so we can test and learn.
Back then, I used Adobe XD (RIP). Here is a sneak peek of the initial prototype.
We tested the prototype and iterated on it and agreed on the MVP in general, then I moved on to defining the design direction.
An important aspect that I thought about from day one is the UX writing of Tuhoon’s brand. In other words, the voice and tone when communicating written content to the user, like button labels, titles, messages (success, error), and empty states.
I put together an initial document with different examples of the UX writing.
The brand
If it’s possible, I will try to get ideas from the logo itself. In this case, Tuhoon has a smile shape that can be used in a lot of cases.
Design direction
This is my favorite part of any product work. I enjoy taking a fresh new branding from the designer and trying to incorporate it into something to be used in screens.
It always reminds me of my childhood when I enjoyed designing UIs for fun. I just enjoy it. A LOT!
I usually start simple and focus on a single screen just to get a sense of the UI.
Here is an initial exploration of the onboarding experience. I worked mainly on exploring the following:
Splash screen
App walkthrough
Sign up flow
We reviewed the above and kept iterating on the design direction.
At this point, we reached an approved design direction for the app’s MVP. The next step is to actually design the rest of the app screens to finish the MVP design.
Here is one of the UIs that we worked on based on the approved design direction.
Illustrations style
Thanks to my wife, Kholoud, we proposed an illustration style to be used within the app UI. She did all the illustration work.
Theming
The app needed to work with different styles. For example, we worked on a special theme for the month of Ramadan.
I got the chance to try working on custom app icons.
I also provided designs for the day and night during Ramadan.
Design spec’ing
In certain UIs, I provided a design spec that will help the development team know a few details ahead of time. For example, providing the fading gradient that is underneath the confirm button.
Review design implementation
We didn’t have a QA person during the first few months, so I wore that hat for a while. I enjoy the process of reviewing a UI and providing feedback to make it better.
Here is a sample of me reviewing an implemented design.
Web design
In addition to the mobile design, I also owned Tuhoon’s web design and front-end development. Here is an example of one of the web designs that I’m happy with.
I’m particularly proud of how the stats section works on small and large sizes.
Helping with the social media designs
I steped in and helped to define a direction for the social media designs to align better with the brand. I designed a few examples and discussed them with the graphic designer.
Here is a sample of what I did:
Tuhoon 1.0
Once the team and I were happy with the design, they hired a full-time designer to continue working on the design. I then rejoined as a consultant for a few months.
Credits
Thanks to Fares Ghandour, Aymane Sennoussi, Hamza Hourmat-Alla, Hadeer Hassan, and everyone who helped me during my consultation time at Tuhoon.
Join my mailing list
Join over 2900 subscribers to explore my thoughts
and favorite links from around the web.
I will share content that:
Clear and explain the point without too much words.
Contains at least one figure or clear example.
Make you learn something new, or at least to remind you of
it.
Rest assure that you will receive top notch quality content
recommendations.