Product Designer
HAYDN
Enhancing User Experience for an AI Writing App
Background
HAYDN needs a web and mobile interface that appeal to the users
The pain points
-
Users need the design to be simple to be able to navigate easily
-
Users need to easily create new documents
The objective: Create an interface for an AI writing app, incorporating necessary features and aligning with an existing style guide.
Key functions:
-
Simplified navigation
-
Ability to quickly start a new document
-
Versatile interface to appeal to the variety of users
The Design Process
Team and role
Team contributions
-
low-fidelity wireframes
-
style guide
My role
-
High-fidelity wireframes
-
Conducting usability tests
-
Usability test report
Target Audience
Marketers of all kinds
-
email
-
social media
-
bloggers
-
content writers
-
social media managers
-
etc
Discovery Phase
Understanding and applying design to the website and mobile app
-
Review of design principles
-
Applying the style guide's elements
-
Usability tests to assess the interface's intuitiveness and identify areas for improvement.
The Outcome
The Solution
Color and Typography added
The solutions emerged as colors and typography were integrated, drawing from a curated color scheme. A clear font hierarchy was established, enhancing the overall user experience.
Design team's Style guide
The design team provided a style guide that was to be followed during the interface design process.
Usability testing and report
Task Senarios
-
Navigate the app and create a new document from scratch.
Measuring task accomplishment
Check the click rates of the task.
-
User 1 was able to complete the task successfully. It took 3 clicks to complete the task
26 seconds to complete the task
User Testing Results:
The user was able to click within the target click range for the tasks. The overall experience was smooth but needed a few minor adjustments to make the navigation more refined.
The Results
The impact of the interface
The final product featured a simplified interface with bottom navigation, providing an intuitive user experience. The deliverables included visuals showcasing the transformed app and its positive impact.
HAYDN app design
Website Design
Project Takeaways
Key Takeaway
Reflecting on the project, the importance of iteration became even more apparent.
What I learned
I gained insights into the significance of colors, typography, and visual hierarchy, recognizing their importance in effective design. Additionally, I learned the value of collaboration among designers and the implementation of visual style guides to enhance the overall interface.
Next Steps
Future projects would benefit from additional user testing between stages, and incorporating card sorts for search and navigation labels could further refine the design process.