HEARTH

Designed a mobile networking app for coffee chats

Caffriend is an mobile start up application that is designed to connect industry professionals with job seekers. Through a gamified card-deck design, this app encourages faster more efficient approaches to securing coffee chats compared to traditional cold emailing.

PRODUCT TYPE

Mobile application

ROLE

Product Design, UI Design

TOOLS

Adobe Illustrator, photoshop

TIMEFRAME

August - September 2025

Process overview:


Since the end of the pandemic, youth employment has been particularly weak — in July alone, employment among 15‑ to 24‑year‑olds fell by 1.2%. As a result, young people are struggling not just to land jobs, but also to build the connections they need to break into the industry.

The problem:

My task was to lead from scratch a design that fit my clients idea and vision for their start up application.

⭐ The first step in this task is to create an identity for our mobile app and map out the features we would want to include.

Project planning:

Above are the preliminary sketches for the wireframe, user flow diagram, and logo sketch ideas.

In addition to the wireframes, I was also tasked with re-designing the clients logo and polishing the branding

Visual Identity:

The client emphasized their desire to keep an orange color palette and to include a coffee bean in some way. Given this, I tried my best to adhere to their must-includes while designing the new logo.

Logo re-design evolution:

The logo went through one round of revisions before the client was satisfied with the result. Their main feedback was to make the logo resemble a coffee bean more closely while maintaining the original concept. Throughout the redesign, I aimed to preserve the brand’s “chat” focus by integrating elements of text bubbles into the bean shape, creating a visual that conveys a double meaning.

Logo proposal:

Original logo

First draft logo

Final logo

Design System:

As mentioned previously, we kept that orange colour palette as the accent for the app. This can be seen in buttons and additional elements.

For typography it was kept simple and readable by using Manrope for the entirety of the mobile interface.

I had only 2-4 weeks to work from start to finish on the wireframes. Starting with the low fidelity.

The challenge:

Due to time constraints, I had to start working on the project asap. This meant that unlike following my usual design process and steps, I had to create low fidelity wireframe ideas quickly and figure out the primary pages since the developer was already beginning to code. I had to prep the onboarding, log in, sign up, and homepage as much as i could first to be able to provide a guideline as everyone in the team was working simultaneously. This was the biggest challenge as it asked for an intense amount of flexibility across the entire team, communication, and task tracking.

Low fidelity wireframes:

Results:

After plenty of review sessions, we were able to move onto the high fidelity phase where the pages began to finalize

Many things were removed, changed, and went through various drafts and itirations. Some mentions would be the back and forth on including a chat feature, adding an extensive calendar scheduling, the onboarding design and visuals, and the pop ups.

Mid-fidelity wireframes before changes:

Final high fidelity wireframes (main pages):

Additional tasks:

In addition to the logo and mobile interface, I was also tasked with designing the landing page and email templates used for the start up as well

Video Demo:

Here’s a quick demo walkthrough of Caffriend and all the pages I was able to design!

Thanks for watching!

Still here? Check out my other projects 👀

Keep reading

BERRYSOUP

Re-designed a website that showcases desktop wallpapers

Improved the UI design and completed the brand concept of BerrySoup across all webpages on the site while addressing previous user feedback.

CANADA AGRICULTURE AND FOOD MUSEUM

Built a fun, educational game for children at the museum

Created an educational game to engage visitors and children to interact with museum activities through a scavenger hunt.