My Role: Sole UX/UI Designer
Services: Workflow Optimization, Research, UI, Templating, Workshops
Platform: Adobe XD Shared Template
Employer: PXL Vision AG
Timeline: 1 month, January 2021
Whitelabel template – through collaborative design
Customer asset collection was broken. Wrong formats, unclear information, constant back-and-forth. Through a shared Adobe XD template with real-time collaboration, brand editing, and SCSS-mirrored tokens, we cut rework time in half and laid the groundwork for a self-service SaaS portal. Better workflows. Happier customers. Faster delivery.
Core shift: From file exchange chaos to collaborative configuration – through structured templates.
3 Min. Read
How we solved problems
Three challenges, three breakthroughs
The problem wasn't the assets. It was the process.
Customers sent logos in the wrong format. Text snippets too long. Colors as hex instead of variables. Every handoff required 3-4 revision rounds. We tried better documentation. Didn't work. So we flipped the model: instead of collecting assets, we let customers configure them directly in a shared Adobe XD template.
Result: rework time cut by ~50%. Process beats documentation. Every time.
Code as source of truth – not design files.
Designers and developers spoke different languages. We defined SCSS variables (tokens) with the dev team first – colors, typography, component variants. Then mirrored them in the XD template. Customers edited visually. Developers received structured, production-ready assets.
No translation layer. No guesswork. One source of truth. Two interfaces.
Real-time collaboration changed the game.
Email threads with 15+ messages. Slack pings. Confusion about «which version?» Adobe XD's co-editing feature let us run live design sessions. Questions answered instantly. Changes visible in real-time. Faster. More fun. More connected. This experience later informed our SaaS self-service portal – because we learned what customers struggle with before building it.
Final Designs
Make it easy to use – even for non-designers
Global Brand Editing
Customers edit colors, typography, and logos in one place. Changes reflect across all screens instantly. Even non-designers using the free Adobe XD version can configure their projects effortlessly.
SCSS-Mirrored Tokens
We defined production variables (colors, typography, component variants) with the dev team, then mirrored them in XD. Designers and developers finally spoke the same language.
Real-Time Co-Editing
Live design sessions replaced email threads. Questions answered instantly. Efficiency and engagement improved. The process became faster – and more human.
Key Learnings
What this project taught me
Convincing stakeholders requires showing, not telling
The product manager was skeptical. Wireframes and arguments didn't move the needle. The pain: fighting with logic alone. What worked: building a quick proof-of-concept, running a live co-editing session, and letting the experience speak for itself.
Collaboration tools are only as good as the process behind them
Adobe XD's co-editing was powerful – but only after we defined SCSS tokens and structured the template around production needs. What saved me: working with developers first, designers second. Code as source of truth beats design files as wishful thinking.
Better tools for customers mean better insights for product
This template wasn't just workflow optimization – it revealed exactly where customers struggled with whitelabel configuration. The pain: customers couldn't predict text length or brand fit. What helped: these insights directly informed our later SaaS self-service portal roadmap.
Why this still matters
The best collaboration tool is a shared canvas
Email threads and Slack pings don't scale. Static PDFs and screenshot feedback loops waste time. The companies that win don't exchange files – they co-create in real-time. This Adobe XD template later became the foundation for a self-service SaaS portal, proving one truth: if you let customers configure instead of request, everyone wins.
Thank you for reading
Related projects