End-to-End App Development
Speech Language Pathology iPad Application
Project Overview
Project Type: End-to-End App Development Team: Independent project with feedback from mentor and peers
Tools: Figma, Optimal Sort, Miro, Zoom Role: UX/UI design, branding
Context:
Speech-Language Pathologists (SLPs) face challenges with administrative tasks like therapy planning, creating resources, and documenting progress. Existing tools are fragmented, requiring repetitive data entry and offering limited integration with their workflows.
Problem Identified:
A comprehensive, platform is needed to streamline the entire SLP workflow, including client management, therapy planning, resource creation, and documentation. This would enable SLPs to provide more personalized and effective therapy while reducing administrative burdens.
Research
Research Objectives
Understand the key challenges SLPs face in their current therapy planning, resource creation, and documentation workflows to inform the development of a more efficient, integrated solution.
Explore the specific features and functionalities SLPs prioritize when selecting tools or systems, ensuring the AI-powered platform aligns with their needs and improves their practice.
Assess how SLPs currently use technology and how their goals for technology integration might evolve in the future, guiding the platform's development to support long-term growth and innovation in the field.
Competitive Analysis
What’s this?
Assessing competitors' products to evaluate their UX and UI design. It helps identify strengths, weaknesses, and opportunities for improvement, guiding your own design by learning from what competitors do well or poorly.
For my SLP app's competitive analysis, I reviewed Magic School, ChatGPT, and Carepatron, comparing their pricing, strengths, and weaknesses. I also evaluated whether they offered onboarding, professional development certifications, and blogs. This analysis helped identify gaps and opportunities for improvement in creating a more comprehensive, AI-powered platform for SLPs.
Key Takeaways
Pricing: Magic School, ChatGPT, and Carepatron offer varying pricing models, with some focusing on subscription tiers and others offering more flexible pricing based on usage. Understanding how each platform structures its pricing helps position SLP.Tools competitively.
Strengths & Weaknesses: Each competitor has unique strengths. Magic School excels in onboarding and user support, while Carepatron provides a comprehensive client management system. ChatGPT is strong in AI-driven content generation but lacks specific features for SLPs. Identifying these gaps offers opportunities for SLP.Tools to stand out.
Features: Magic School offers professional development certifications and a strong community focus, while Carepatron includes robust documentation tools. SLP.Tools can differentiate by combining these features into a more cohesive platform tailored to speech-language pathologists' workflows.
User Experience: Competitors vary in user experience quality. SLP.Tools can focus on streamlining workflows, simplifying navigation, and offering customizable dashboards to address common pain points identified in the analysis.
User Interviews
In conducting user interviews for the SLP.Tools app, I held one-on-one discussions with potential users, using a structured set of prepared questions. I encouraged open-ended responses to allow participants to share their experiences, preferences, and pain points in detail. By recording these interviews and taking comprehensive notes, I aimed to uncover key insights and identify recurring themes that would guide the app’s development.
I completed five interviews with speech-language pathologists who had varying levels of experience, working in both public school settings and private practice. This range of perspectives ensured a well-rounded understanding of the challenges and needs in different professional environments.
Key Takeaways
Dashboard:
SLPs want a central hub where they can efficiently access schedules, upcoming sessions, and lesson plans. Many expressed the need for a streamlined dashboard that consolidates key information, reducing time spent switching between different tools and resources.
A customizable dashboard was highlighted as a desired feature, allowing SLPs to personalize it based on their workflow.
Student Profile Pages:
SLPs emphasized the importance of comprehensive, easy-to-navigate student profiles. These profiles should include key information like IEP goals, progress reports, session notes, and diagnosis history.
Several SLPs mentioned that integrating the ability to track progress over time through visual reports or automatic updates would be valuable.
Documentation:
Managing and updating documentation, particularly IEPs and progress notes, is a significant pain point. SLPs wanted the app to simplify this process by auto-generating summaries, formatting reports, and offering templates to speed up the process.
Ensuring confidentiality and secure storage of student data was consistently mentioned as crucial.
Personas
What’s this?
Personas are important because they provide a clear, human-centered understanding of target users, helping designers and developers create products that better meet user needs. Personas are developed through a combination of user interviews, research, and data analysis. By gathering insights from real users—such as their goals, challenges, behaviors, and preferences—designers can create fictional representations that reflect common user types.
How might we?
What’s this?
"How Might We" (HMW) statements are crafted from insights gathered during user interviews, research, and observations. By identifying key challenges or pain points, these insights are reframed into open-ended, solution-focused questions beginning with "How might we..." This approach helps to inspire innovative ideas by turning problems into opportunities for improvement and exploration.
How might we design an integrated, AI-powered platform that streamlines the entire workflow for SLPs, allowing them to efficiently plan therapy sessions, create tailored resources, and document client progress, so they can focus more on delivering impactful therapy?
How might we create a tool that streamlines documentation and resource creation processes, reducing the time spent on administrative tasks so she can focus more on delivering high-quality, individualized therapy sessions?
Feature Set
What’s this?
The Feature Set section highlights the key functionalities designed to enhance the user experience. Each feature was crafted based on user research and feedback, solving real user problems and supporting their goals. This section provides an overview of how these features improve navigation, streamline workflows, and create a seamless, intuitive experience.
Design and Prototype
Site Map
Planning a site map for SLP.Tools involved outlining the app's navigational structure, focusing on key features such as lesson planning, client information, and reports. By organizing these elements in a logical and cohesive way, the site map plays a critical role in ensuring an intuitive user experience. It helps users navigate seamlessly through the app's functionalities, ensuring they can easily access what they need. Site maps are essential because they provide a clear overview of the app’s structure, guiding both designers and users through the layout and functionality, and preventing confusion or disorganization as the app evolves.
What’s this?
A user flow is a detailed diagram that outlines the complete journey a user takes to achieve a specific goal, including decision points and alternative paths. It visualizes various routes based on user actions and choices. Informed by user research, user flows help designers understand how users navigate the product, identifying any potential bottlenecks or friction points in the experience.
User Flows
What’s this?
A site map is a visual representation of a website or app's structure, outlining how pages or sections are organized and linked together to guide users through the content.
The user flows for SLP.Tools were designed to ensure a smooth, intuitive experience for speech-language pathologists as they navigate key features such as lesson planning, student profiles, and progress tracking. By mapping out the steps users take to complete tasks, I identified potential friction points and streamlined the process for each function. These flows focus on minimizing clicks and simplifying the journey from one task to another, ensuring that SLPs can efficiently manage their workload with minimal effort. The result is a user-centered experience that supports productivity and ease of use across the platform.
Low- Fidelity Wireframes
In the initial stages of developing the SLP.Tools app, I used hand-drawn low-fidelity wireframes to establish the basic structure of the interface. These quick sketches helped me visualize essential components such as the dashboard, lesson creation sections, and student profile pages. This approach allowed for rapid exploration of different user flows and layout possibilities, providing a flexible framework that guided the design process. By starting with low-fidelity wireframes, I was able to focus on functionality and user experience early on, setting the stage for more detailed prototyping and refinement later in the project.
What this?
Basic, rough sketches focusing on layout and structure without detail. Used early in the design process to explore ideas quickly.
Mid- Fidelity Wireframes
What’s this?
Mid-fidelity wireframes add clarity and interaction, refining layout and functionality based on initial feedback.
For this app, I developed mid-fidelity wireframes using Figma to enhance the detail and structure of the key screens. This digital transition from low-fidelity sketches provided a clearer view of the app’s layout and functionality, allowing for a more precise exploration of user interactions. The mid-fi wireframes helped identify any usability issues and allowed for iteration based on peer feedback, particularly focusing on improving the dashboard and student profile screens. This process laid the groundwork for more polished, high-fidelity designs by refining navigation and feature placement to ensure a seamless user experience.
Branding
In developing the branding for the SLP.Tools app, I focused on capturing the core essence of speech-language pathology, considering symbols that represented communication, learning, and progress. This design not only resonates with the app’s purpose but also provides a clean, modern look that appeals to both professionals and clients.
Style Guide and Components
The style guide and UI component library for SLP.Tools ensure consistency and cohesion across the app's design. The style guide defines essential elements like typography, color palette, iconography, and buttons, reinforcing the brand identity and promoting an intuitive user experience. The UI component library complements this by providing reusable design elements, streamlining development and ensuring a unified look and feel throughout the app. Together, these tools support efficient updates and maintain a cohesive, user-friendly interface.
High-Fidelity Wireframes
What’s this?
High-fidelity wireframes are detailed, interactive mockups that closely resemble the final product. These wireframes include finalized design elements, such as precise typography, color schemes, and imagery. They are used to showcase the app's visual identity and overall user experience. Based on user feedback from earlier stages, the design has been refined to improve usability, ensuring that navigation and functionality are intuitive and aligned with user needs.
When creating the high-fidelity wireframes for the SLP.Tools app, I built upon the insights and feedback gathered during mid-fidelity testing. Key improvements were made to the layout, navigation, and visual elements based on user feedback, ensuring a more refined and intuitive user experience. This stage allowed me to finalize the design elements, such as color schemes, typography, and interactions, while addressing usability issues identified during the mid-fidelity phase.
-
![]()
Dashboard
-
![]()
Articulation Generator
-
![]()
Grow it.
-
![]()
Notes
-
![]()
Client Page
What’s this?
User testing is a process where real users interact with a product or prototype to identify usability issues and gather feedback. It helps understand how users experience the product, ensuring it meets their needs and expectations. Feedback from user testing is analyzed and used to refine the design, addressing pain points and improving the overall user experience to better align the product with user needs.
UI Interactions
User Testing
I conducted user testing for the SLP.Tools app with both speech-language pathologists and UX/UI designers to gather diverse insights. Speech-language pathologists provided valuable input based on their firsthand experience and specific needs for the app, while UX/UI designers offered critical perspectives on design and usability. The testing was a mix of moderated sessions via Zoom, using Figma prototypes for real-time feedback, and unmoderated testing due to time constraints. This combination allowed for a well-rounded evaluation of both functionality and design, ensuring the app is both practical and user-friendly.
Iterations
Through UX testing, I identified areas for improvement on the client profile page. SLPs felt that more lessons should be highlighted, and the "add more lessons" option was seen as redundant. In response, I reorganized the layout to prioritize key lessons, reducing unnecessary elements for a cleaner and more functional design. The original black-and-white theme was perceived as too muted, so I incorporated varying shades of purple from the SLP.Tools logo to create a more visually engaging and cohesive interface. Additionally, I added a clear title to the articulation word list generator, enhancing its visibility and usability. These changes, made during the iteration stage, were focused on improving the app's user experience while maintaining brand consistency.
Key Takeaways
What’s this?
Iteration is the process of repeatedly refining and improving a product, design, or solution based on feedback and testing. Each cycle of iteration involves making adjustments, testing the changes, and evaluating the results to move closer to an optimal outcome.
Improved Client Profile Organization: Users found the client profile page could be better organized. The iteration highlighted key lessons more prominently and removed redundant features like the "add more lessons" button, streamlining the interface.
Enhanced Visual Design: The original black-and-white theme was considered too muted. Based on feedback, I incorporated various shades of purple from the SLP.Tools logo to make the design more visually engaging and aligned with the app's branding.
Clarified Features: Adding a title to the articulation word list generator improved clarity, addressing confusion users had during testing about what the feature was for.
User-Centered Refinements: Feedback led to refinements that improved usability and ensured the app was better aligned with the workflows and needs of SLPs, particularly in simplifying lesson management and making progress tracking more intuitive.
