Connect PBX

Mobile app for a business phone system

Design Portfolio

Mobile App - Portfolio Project

To view more, please use desktop mode :)



The current app is outdated and clunky. Many functions are redundant and hard to find.


Improve the user flow to enable ease of use and bring visual design to modern standards.

What I learned:

Making an entire app is a huge undertaking. I initially thought I would put in every feature I wanted in a phone system app. after a while, I had to reel in my expectations for what was possible to complete with a limited skillset. After spending way too many hours on the prototype phase, I settled on making a handful of user flows that were the most impactful.

What I would do differently:

This project was made without any repeatable components. If I were to complete this app, or do another similar project, I would put much more effort into creating repeatable elements rather than making everything custom and unique.

User Research

For this project, I conducted several usability studies and multiple rounds of interviews after each iteration of the design. Research participants were given the opportunity to provide feedback after each round of questions.

Pain Points


Voice Chat

Some users, especially ones who were not as tech-savvy, had difficulty differentiating between voicemail and voice chat.


Button Size

Some users found the buttons to be difficult to press in the Figma prototypes.



Some users liked using gestures to navigate, and others did not.


"I’m so glad I have the opportunity to work from home. Commuting was a real chore."





Family Status




Job Title

Legal Assistant

Most used device



Art credit: Framui



Cassie wakes up at 6 am to make sure she gets to the gym before making back home and signing in to her computer for work on time. As she goes through her morning routine she is taking mental notes of what she needs to do that day. “File briefs, call clients for the 3 cases she is working, and order more legal notepads,” she thinks to herself while she brushes her teeth. She organizes everything in her online calendar as she eats her breakfast. As she looks through her calendar, she sees an automatically generated meeting invitation for a video call with her boss. She accepts the invite and opens the Connect app to send her boss a message: “Did the meeting with Corpa Capital get moved to today?” Her boss calls Cassie to go over the details of the meeting.


• Keep her work and personal life separate, but equally organized.

• Be great at her job, and make connections she can use as references.

• Study for the law school admissions test in her spare time.


• Using technology for work and school does not come naturally to Cassie.

• Can never remember all of her passwords.

• Can’t figure out copy/paste on her smartphone.

User Journey Map








Transfer a call to her boss without dropping the call

Speak with boss

Set reminder

Place a call

Prepare for transfer

Transfer Call

• Receive call from boss

• Take notes on who to call and when

• Open calendar

• Set reminder and save

• Open Connect app
• Go to contacts tab

• Find contact and call

• Introduce herself and let the person know she will connect them

• Press transfer

• Select boss from list

• Confirm Transfer

• Understanding

• Curious

• Determined

• Nervous

• Neutral

• Unsure

• Notes feature

• Calendar integration

• Transfer confirmation

• Animation

Starting the design

The main consideration when making paper wireframes was deciding whether to use a homepage with a dashboard or not.

I wanted to make the calls page feel familiar to what users experience on iOS and Android. We did not want to reinvent the wheel here.

Digital Wireframes & Lo-Fi Prototype

The goal here was to make the calls page feel familiar to what users experience on iOS and Android. We did not want to reinvent the wheel.

Accessibility is key when designing features like voice recording, so I decided to make the button very large, since this screen was intended only for this one purpose.

At this point in wireframing, it was so exciting to be able to make the features I thought a great app needed. Learning new tools is an awesome experience.

View Lo-Fi Prototype

Usability Study & Design Iterations

Round 1 Findings


Everyone expected the filters to work


Some icons are inaccessible because of their size

Round 2 Findings


Accessibility features are better for everyone


Users expect a confirmation after they transfer a call

Not all features appeal to all users

  • Some users are completely new to the idea of sending a voice chat.

  • Users may not know that a voicemail and a voice chat are different things.

  • Once users were able to find the feature, they could use it without issue.

Let users know they completed a transfer

  • Most users were unsure that their call transfer was completed successfully.

  • Implementing a confirmation screen was a quick and easy fix.

  • Simple things like this can be forgotten when designing without any outside input.

Accessibility Considerations


Button size matters. In the real app, I would make sure to implement multiple accessibility options that would adjust button and text size.


Users may not be very familiar with how many features are available on phone system apps. Giving them explanations can be helpful.


Some users did not remember what page they were on, so I added a light background on the bottom nav to remind them what section they are currently in.

HI-Fi Prototype

I consider my first ever prototype to be a huge accomplishment. Learning what is available in UX design software was an exciting endeavor, and at this point in my learning, I felt I could make anything. The reality was that I still had a lot to learn after completing this project. Moving forward, I learned about making components and using existing elements and layouts to expedite the design process and create more organized structures.

View Hi-Fi Prototype

Back to Portfolio