InPractice Psychology
UI/UX Design, Website Design, Branding
Summary
InPractice Psychology is a New York Metropolitan-based therapy practice. Having outgrown their existing website’s design, I was hired to design a new website for them that reflected their growth and brand.
Information
Timeline: 1 year (approximately 3 months with pauses in-between)
Platform: Website
Tools: Figma, Illustrator, HTML, Squarespace
My role: UX/UI Designer
Process
As this job was also a rebranding-assignment, I worked from the concept-up to the final product, working with the client at every step and implementing their feedback at every turn.
The Problem
InPractice Psychology, previously named Dr. Michelle Chung Psychology, was originally a solo practice under the forenamed psychologist. Looking to expand to a group practice for other clinicians, Dr. Michelle Chung needed to change her practice from a personal one to a group brand, starting with her website.
Problem Statement: Dr. Michelle Chung Psychology is currently branded as a solo practice under one psychologist. Her practice’s first impression on new clients and potential clinicians is the website. Without a head-to-toe rebrand, her current practice does not attract other practicing clinicians to apply for positions, limiting the practice’s growth.
Client’s Needs and Goals
Establish a brand that conveys an appropriate aesthetic that matches with Dr. Chung’s methods of practicing mental health.
A group practice has more success in obtaining new clients as well as clinicians who are looking for a position as the practice.
Dr. Chung’s first goals in growing a group practice is to have a larger staff of clinicians and specifically offer work and experience to training psychologists.
The Solution
The most concrete solution to demonstrate a rebrand is to redesign the website. This website would have remade UI that complements the brand’s new aesthetic, new pages that establishes the transition to a group practice, such as new members and provided services, and improved UX and SEO that allows users to easily understand what the practice does and lead to an increase in new clients.
Analyzing the Initial Website
Ideation
The ideation process for this project was primarily competitive analysis. I asked the client for other practices’ websites that appeal to them and analyzed the UI design to see what features and design choices I need to make for their website, along with the improvements I noted in the original review of the initial website.
Competitive Analysis - Navigation Menu
User Flows
After analyzing the design and flow of other e-commerce mobiles apps and sites, identifying and creating the most important user flows was the next crucial step in our process. We based our first user flows on the app’s primary usage and Miracle Cycle’s goals with the app, labeled as “Browsing” and “Checkout.”
Low Fidelity Wireframes
Once the user flows were mapped out, it was a straightforward matter in creating the respective screens going into the sketching phase. However, because of the straightforwardness of the user flows and screens, I skipped the sketching process and went straight into designing the low-fidelity wireframes. I decided that the sketch phase was unnecessary for this project because I already had pre-made e-commerce assets ready in Figma, so it was just a process of assembling these assets into my design.
As the UI designer, the main qualities I decided for a user-friendly e-commerce app were simplicity and familiarity. The users should be able to browse and search for products with ease. For example, I put the filters in a conspicuous and easily accessible location by having it be a simple button. The results show minimal information about the product, so it doesn’t look cluttered.
User Testing
After my initial wireframes were complete, as part of the design process, I conducted one round of usability testing with five users in order to obtain feedback to improve the design. I gave them the prompt to add a bike to their cart and then checkout. I was checking for the following:
How would they shop for a bike based on their previous experiences using ecommerce apps?
Is the current flow intuitive?
How did they feel when they were prompted to login?
Were there any design choices that hindered the flow?
Edit: Added Filter Pages
The biggest concern I got from the feedback was that the filter pages were implied but not there. For them, the ease of use and process of specifying searches greatly determined if they would use the app or not; if the process was too difficult, they would choose to use another app or method to find a bike. I designed the filter pages and conducted another round of testing with a different group of people. To test the usability of the filters, I specified the prompt to “Find a bike for your male friend that’s under $3,000.”
Style Guide
Miracle Cycle described their brand in the following words: savvy, focused, serious, dependable. For an e-commerce app, I decided that the palette should be simple so that the products could be displayed clearly, and opted for a lot of neutrals. However, to convey a sense of activity and energy, I went with bright green and orange as the respective primary and secondary accent colors.
High Fidelity
Prototype
Learnings and Retrospects
I have experience in working with and designing for clients in the past for graphic design projects, so I approached this project with an understanding on how to give clients what they are looking for. What differentiated this from my past work was not just being in-charge on the visual front in UI, but also in-charge as the UX designer, which required a three-dimensional sense of empathy. I had to think about not just what our client Miracle Cycle wanted, but I also had to put myself in a user’s shoes and thoughts throughout the process of designing the app. As the only UI and UX designer in this team, it was difficult to maintain that level of empathy throughout the project, as being one person meant it was easy to tunnel vision. The usability tests were crucial in helping me stay in-tune to others’ experiences so that I could create what they wanted.
What’s Next?
In regards to Miracle Cycle, what’s next for the app’s progress is continuing to develop itself around the users’ experiences, which we discovered above. So, what would be immediately next for this app would be to improve the product detail pages. We would also develop around more user flows, such as product recommendations and assistance.
For me, working with an e-commerce brand to develop an app for them to help them sell more products is an enriching and valuable experience. It required me to research and empathize with an audience I was unfamiliar with beforehand, and creating this app allowed me to connect with them. With this experience, I hope to continue to work with Miracle Cycle so they can reach more users and audiences, and I know how to approach developing an e-commerce app in the future.