UX & UI DESIGN
Start-up company user experience, customer journey, web design, and web development.
Role
UX Researcher & UI Designer
CX Journey Mapping
Web designer
WordPress Developer
Technology
WordPress
Adobe Photoshop
Acuity Booking Calendar
Stripe Payment Gateway
Background & the Challenge
Companion Matters is a local startup that aims to help seniors and persons with disabilities stay connected with their loved ones. They needed a solution where people could learn how the service works, select a package based on individual needs and desired level of contact, schedule the frequency of the calls, and set up a one-time payment or a recurring payment plan with a subscription.
Target Audience
Senior citizens, baby boomers & persons with disabilities.
Industry
Elderly Care – B2C
The UX Design Process
I started by following a 6-stage design thinking model, going through all the stages with a very hands-on approach.
Along with the stakeholders of the company, we conducted a user research study and interviewed participants based on the user personas created for this project.
I was in charge of conducting a competitor analysis, creating user flows, and designing wireframes, and user interfaces.
Lastly, I got to work on the most challenging aspect project, the the integration of scheduling capabilities. The scheduling process was a multi-step process with several requirements that needed to follow a certain sequence. The last step would be setting up a payment gateway to process payments online.
Discovery and UX Research
To kick-start the project, we focused on figuring out a research strategy.
The goal was to identify the users so precisely that the user experience would be familiar and with a minimal learning curve.
We asked family members and caregivers of people over the age of 62 who had a loved one living alone or in a retirement community.
I created an interview guide beforehand in preparation for the usability test. This allowed the team to conduct interviews in a consistent and controlled manner.
Throughout the interview process and research, we defined and refined the user personas, this was a critical task for the process.
- Who is the target audience and what do they need?
- What are their habits, culture, their personalities, and their limitations?
- What are their pain points, and challenges, and how to address them?
By conducting a usability test, and interviewing people who fit the user persona’s profile, we were able to identify any flaws in the initial model.
The Define Phase
At this stage, I analyzed my research findings from the empathize phase.
This helped me to determine which user problems were the most important to solve and why.
The goal was to help users find what they needed and start the sign-up process.
Low Fidelity Wireframes
Wireframing is a critical step in the web design process that sets the foundation for a successful, user-friendly website.
It serves as a blueprint, allowing designers and stakeholders to visualize the layout, structure, and functionality of key pages before any visual elements or code are applied.
By mapping out user flows and content hierarchy early, wireframes help identify potential usability issues, streamline navigation, and ensure that the design aligns with business goals. This clarity reduces costly revisions later and ensures a focused, goal-oriented user experience from the start.
Story Boarding
After defining the user’s path, I created high-level mood boards that expressed specific feelings and highlighted attributes. Mood boards gave me the chance to define the design direction.
This step is especially helpful to gain momentum during the early stages of a project.
Mood boards are an awesome tool I constantly use to help me sell concepts and ideas.
The Design Stage
The homepage was intended to provide a central place for users to be introduced to the service.
A short explainer video on how the process works, and reinforcing the information we are trying to convey in a more descriptive and engaging way.
Prototyping
In this stage, an interactive prototype is built to show how the solution works “live” in the browser. Cutting down production time in half for faster delivery and without compromising quality.
The interactive prototype allows time for testing the solution early, and often. One of the first things I look for is the level of detail, ensuring it is high fidelity and has adequate screen resolution.
Then, proceeding to test the functionality, and how the solution works in real environments.
- Is the solution fully functional and open to the user?
- Can users easily navigate through it, and at the same time, restrict certain areas that require signing or payment to be accessed?
Digital prototyping is exciting as the prototype resembles the final product, allowing real-time testing and validation of ideas.
Development
The development stage is a lot faster since there is a functional prototype.
At this point, I just make sure everything is plugged in correctly, clean coding, backend environments, plugin integrations, and cross-browser testing.
Usability Test
Performing a usability test allows me to know what users are experiencing, and at the same time compare the interfaces to industry standards. Having an evaluation scale helps to keep things simple, utilizing 3 ratings: “poor, fair, pass.” Usually, I like to ask some people to test drive the interface, as they can identify more issues.
There are sections with some questions for each section in the usability checklist: accessibility, navigation, visual information, and labeling.
Once a “Passed” rating is achieved in all the questions, I can be confident users will find what they need. This process uncovers issues missed and identifies the ones that were addressed successfully.
Deployment
The process involves several steps, including securing a hosting account, setting up DNS records correctly, implementing SSL certificates, setting up a staging and a production site, and setting up email accounts for users if requested.
Conclusion
The extensive user research and aligned with a comprehensive user-centric design and development for Companion Matters successfully addressed the needs of the organization. Resulting in a user-friendly and accessible platform for seniors and individuals with disabilities.
I was particularly satisfied with the seamless integration of a complex scheduling tool with membership-level options and payment gateways. The solution streamlined the process, significantly enhancing user satisfaction and engagement.
Next Steps
- Ongoing User Feedback: Continuously gather and analyze user feedback to identify areas for improvement.
- Feature Enhancements: Explore additional features based on user needs, such as more detailed scheduling options and personalized communication.
- Marketing and Outreach: Implement targeted marketing campaigns to increase awareness and user adoption.
- Regular Updates: Ensure the platform remains up-to-date with the latest technologies and security measures.
For further improvements and support, feel free to reach out for ongoing consultation and development services.
Get in touch
Let’s create something exceptional!