Dotter
Dotter is an innovative embroidery pattern application created to make embroidery more accessible to everyone. This redesign was part of my internship at ToysInBox, where I worked on transforming Dotter into a tool that feels both empowering and approachable.
Role:
UI UX
Timeline:
April 2025
Tools
Figma
Background & Target Audience
The primary focus of this project was to address the needs of two underserved user groups - younger tweens and older adults - both of whom often face significant challenges when starting embroidery projects. My goal was to create a seamless, user-friendly experience that would inspire creativity and make embroidery enjoyable for users of all skill levels.
We centered the redesign on two core demographics:
Younger Tweens (10–14 years old): Curious and eager to explore creative hobbies, but often intimidated by the complexity of traditional embroidery techniques.
Older Adults (50+ years old): Interested in crafting but often frustrated by outdated, unintuitive digital tools.
Key Challenges for Both Groups
Difficulty in understanding embroidery basics.
Frustration with translating specific design ideas onto fabric.
Limited creative freedom due to a lack of customization options.
These challenges were identified through user feedback, product testing, and research conducted during my internship.
Key Features
Numbered Side Panels
Step-by-step guidance through numbered side panels simplified the embroidery process for beginners.
Undo/Redo Buttons
Familiar undo/redo functionality empowered users to experiment without fear of making mistakes.
Automated Distance Checker
An innovative feature that automatically checks distances between pattern elements, highlighting potential issues with a caution icon.
Fast Placement Mode
A toggle designed for advanced users who wanted to work faster without sacrificing accuracy.
File Icon Dropdown
Expanded import/export capabilities offered greater flexibility, including support for multiple file formats.
Differentiated Dot Colors
Enhanced visibility of embroidery patterns by using distinct dot colors based on size.
Clear 2D vs. 3D Views
A redesign of the preview system clearly distinguished between 2D and 3D views, helping users better visualize their designs.
Challenges Faced
As part of my internship, this redesign introduced a few hurdles:
I used Lit and Adobe Spectrum, both of which were new to the project and required time to master.
It was crucial to ensure the app was intuitive for beginners without overwhelming advanced users.
These challenges pushed me to develop creative solutions that ultimately improved the final product.
Before
Unpolished and disjointed interface.
Limited guidance for users.
Minimal customization options.
After
A cohesive, visually pleasing design inspired by modern tools like Adobe and Figma.
Intuitive step-by-step guidance for beginners.
Robust customization features that empower users to bring their unique designs to life.
The new Dotter interface removed barriers to creativity, empowering users to:
Easily upload and customize patterns.
Confidently preview and refine their designs.
Explore new creative possibilities with expanded options..
Key Takeaways
Redesigning Dotter as part of my internship at ToysInBox taught me the importance of empathy-driven design and iterative development. By combining thoughtful design principles with powerful tools, we created a platform that inspires creativity and makes embroidery accessible to everyone.
This project reinforced:
The value of tailoring designs to specific user needs.
How leveraging modern frameworks can unlock new possibilities.
The impact of balancing aesthetics and functionality.
