Designer/Researchers: 1🧍🏽
Stakeholders: 2 👫
Figma
Adobe Ilustrator
Webflow
Monday.com
1. Research & Understanding 🔬
2. Ideating 💡
3. Design 🎨
4. Testing 💬
What seems to be Frontier Dental Care's problem??
Frontier Dental Care's old website lacked user-friendliness and personality, hindering patient access to vital information and online interactions. This compromises patient satisfaction, engagement, and potential for practice growth.
Preparing for my initial interview with my client, I wanted to make sure that I was asking all of the right questions, such as:
They asked me to simplify the "Procedures" section and emphasize Dr. Ramos' role and capabilities, while rewording heavy dental/medical jargon to better connect with users.
They expressed concern in the excessive cognitive load in informational pages and navigation bar, making it hard for users to navigate the site.
With their new school, Frontier Dental Assisting Program (FDAP), their new dental insurance program, and need for reviews, FDC was looking to take their marketing to the next level.
In redesigning Frontier Dental Care's website, I leveraged user stories to drive design decisions. By distilling user needs into concise narratives, I gained insights guiding every aspect of the project. This approach ensured purposeful design elements, resonating with our audience and fostering a seamless user experience. Through user stories, I empathized with users, prioritized features, and delivered a site that elevates the patient experience.
As a website visitor interested in Frontier Dental Care's services, I want to see patient testimonials and any current specials when I access the Appointment Page.
As a new user visiting the Frontier Dental Care website, I want to easily book an appointment so that I can receive dental care conveniently.
As a site visitor, I want easy access to various dental procedures so I could understand which services are right for me.
In order to prepare for the design process, I wanted to get a better understanding of what kind of interfaces inspired them. So, together, we looked at a few successful dental websites that I listed below and analyzed their content and thought of ways we could do it better.
- Personal landing page with engaging header
- Simplified Navigation & clear CTAs
- Procedures display is concise, yet informative
- Lack of weaknesses, other than minimal center-aligned elements
- Some sections are too wordy/ have excess jargon
- Clear CTA buttons and sections
- Informative, held consistent branding and cta usage throughout the site
- CTA contrast is poor
- Font is too rugged and harsh
- UX Writing very basic, lacked personality
Crafting Frontier Dental Care's digital presence involved establishing a cohesive design system that unifies the brand experience. We meticulously curated a color palette to evoke trust and warmth, while an icon library enhances usability and accessibility. Thoughtfully paired fonts convey tone and personality, ensuring consistency. Refining the logo imbued it with clarity and versatility, embodying the brand's ethos across all touchpoints. This comprehensive approach elevates user engagement and reinforces Frontier Dental Care's identity.
In the redesign of Frontier Dental's website, the color #002144 was strategically chosen for its deep, calming effect, evoking professionalism and trust in the medical field. Complemented by #005dc3, a vibrant blue hue symbolizing reliability and loyalty, it establishes a sense of security and reassurance for visitors navigating the site.
To highlight important elements and calls to action, the bright and attention-grabbing shade of #ffc254 was integrated, adding warmth and energy while guiding users through the interface. The inclusion of #5590D0, a lighter blue tone, enhances the overall visual appeal and fosters a welcoming atmosphere, encouraging engagement and exploration.
Finally, the use of #FFFFFF as the background color ensures clarity and readability, providing a clean and spacious canvas for content presentation while maintaining a modern and professional aesthetic.
Procedures Section 🧱
In the Procedures section wireframes, I aimed for clarity and user-friendliness. I organized procedures into 3 distinct and clickable categories for easy navigation. This layout promotes user engagement and transparency.
Google/Yelp Reviews 🌟
My client stressed the importance of reviews in the healthcare system, so I made sure to create a layout that established trust and encourage interactivity with the reviews, encouraging users to "see for themselves."
Landing Header Section 🙌
While conducting research, I found that most successful dental websites paired a CTA with a "personality" element. To emulate this, I added a hero image of a smiling patient to convey a welcoming atmosphere, a clear and concise headline instantly communicates Frontier Dental Care's value proposition, and a prominent call-to-action (CTA) button to encourage users to book appointments, enhancing conversion rates.
Nav Bar 🧭
Knowing how a common painpoint was excessive cognitive load in the nav menu, I optimized the Navigation Bar for Frontier Dental Care's site by streamlining the menu, using clear labels, and prioritizing essential elements.
In Phase 3 of the Frontier Dental Care Website Re-Design project, our focus shifted from ideation to design and prototyping—a pivotal phase where concepts began to take shape. This phase marked a significant step towards creating an intuitive and engaging user experience that directly responds to user research insights.
New Headline, Happier Users
In the redesign of Frontier Dental Care's landing page, we transitioned from a generic headline to a heartfelt message that emulates everything they stand for, fostering a more personal connection with their current and prospective patients.
Every Journey Needs a Good Navigator!
Given that my client and their patients found the site to be difficult to navigate, I made it my mission to understand why that was. As you can see, we transitioned away from having heavily nested nav items to a more concise, clean solution that supports their patient population with cognitive disabilities.
Overpopulated Site
Additionally, with client agreement, we removed unnecessary pages that user testing indicated were rarely visited by prospective patients. This strategic approach streamlined the user journey, resulting in a more efficient and intuitive browsing experience that aligns with Frontier Dental Care's commitment to user-centered design.
Iffy on a Procedure? See the Reviews 😎
To continuously build trust with new users throughout the site, I made the informed decision to add our new Reviews Section to each procedure page. This way, any doubts of quality of service will likely be alleviated with positive reviews always being available.
Concise Descriptions, Quicker Treatment
In the redesign of Frontier Dental Care's Procedures Pages, we underwent a transformative shift from an intricate system of individual pages for each procedure to an organized, categorized structure. With over 50 procedures at hand, the previous design posed significant navigation difficulties for users.
To address this challenge, we strategically grouped procedures into Cosmetic, Surgical, and General categories. Each procedure is now compiled into its respective list, enhancing user clarity and simplifying their journey.
Cursive Italic.. in 2023??
In the redesign of Frontier Dental Care's Testimonial Section, we embarked on a transformation from an uninspiring, hard-to-read format to an engaging, accessible, and interactive user experience. The previous design's cursive serif font posed readability challenges, potentially discouraging engagement with patient reviews. Moreover, it lacked links to Yelp and Google reviews, despite clear user interest in accessing these external sources.
Clean, Concise, and Captivating
In response, we introduced a clean and easily readable font, alongside an engaging title and subtitle that captivate user attention. Most significantly, we added direct links to Yelp and Google reviews, catering to users' preferences and providing a seamless pathway to more extensive feedback.
This comprehensive approach not only improved the visual appeal but also encouraged user exploration and trust in patient testimonials, aligning perfectly with Frontier Dental Care's commitment to transparency and a user-friendly online presence.
Main User Insights
In response to rigorous usability testing, the Frontier Dental Care website underwent strategic enhancements aimed at optimizing user experience and accessibility. Here's a glimpse into the changes implemented:
- Visual Enhancements: Updated images were carefully selected to resonate with users and convey the essence of Frontier Dental Care's brand identity. Deepening the contrast of key elements ensures readability and meets web accessibility standards, promoting inclusivity for all users.
- Interactive Transitions: With the addition of subtle yet impactful transitions to site elements, the user interface now comes to life, offering a more engaging and seamless browsing experience. These transitions not only captivate users but also guide them intuitively through the site's navigation, enhancing overall usability.These refinements, informed by extensive usability testing, reflect our commitment to continually improve and evolve the Frontier Dental Care website, ensuring that every interaction is meaningful, intuitive, and accessible to all.
Biggest Challenges
One of the most valuable lessons I've learned during this project is the art of balancing client expectations with the core principles of user-centered design. This challenge, in particular, resonated with my experiences as a design student at UC Davis, where I honed my skills in finding the equilibrium between aesthetics and functionality.
It involved adeptly navigating client feedback, aligning their vision with the best practices in UX/UI, and advocating for solutions that prioritize user needs. These experiences not only affirmed the importance of clear communication and collaboration but also enriched my ability to bridge the gap between client aspirations and designing for exceptional user experiences.
What does this project mean to me?
This project holds immense personal significance to me. It represents the rewarding intersection of my passion for UX design and my desire to make a tangible impact on a local business and its community. Working closely with Frontier Dental Care allowed me to respond directly to the needs of a real local business and the people it serves.
The opportunity to enhance user experiences and streamline accessibility for those seeking dental and medical care has been incredibly fulfilling. It's not just about design; it's about creating meaningful connections and ensuring that users can access essential healthcare information effortlessly.
This project has not only enriched my professional portfolio but also reaffirmed my commitment to user-centric design and the positive changes it can bring to both businesses and individuals.
