Designing TISSO's website in collaboration with Ommax and BYKARB: Balancing brand identity, accessibility, and systems thinking for a scalable digital presence.
TOOLS Figma
TIMELINE 16 week
VISIT SITE tisso.de
BYKARB guided the brand direction, and I provided UI input to ensure accessibility and refine areas where visual decisions affected usability. I worked alongside two other parties on this project: BYKARB on branding, and Ommax's UX team on structure and flow, so a large part of the work was making sure all three perspectives stayed aligned.
How do you protect a brand's visual identity while making sure it actually meets accessibility standards, without either side losing?
With Ommax's UX team, I reviewed wireframes, helped resolve gaps in user flow, and collaborated on improving structure through open, practical dialogue.
The constraint
One key challenge was adapting TISSO's bright yellow brand color to meet accessibility standards. The color was core to the brand's recognition, but didn't hold up against contrast requirements. After testing alternatives, we found a shade that maintained brand recognition while improving contrast, used selectively in banners, CTAs, and imagery for clarity without compromising the brand.
Once the foundation was clear, I created a complete UI component library, hi-fi wireframes, and a Figma-based style guide to support a smooth developer handoff.
Handoff started with the low-fi wireframes Ommax's UX team had already mapped out. My job was turning those into high-fidelity wireframes, adding annotations and documentation where developers needed extra clarity, all organized inside a single Figma file, with Figma comments and video calls carrying most of the back-and-forth as questions came up.
Alongside that, I built a full component library covering the key elements needed across the site, e-commerce interfaces have a strange balance to strike: a lot of the structure genuinely benefits from standardization, product cards, forms, CTAs, but the brand still needed to feel distinctly TISSO, not like a template. Getting that balance right wasn't a single decision, it took a few rounds of UI proposals before we landed on a direction that felt custom to the brand and reflected the growth TISSO was going through, rather than defaulting to what was easiest to standardize.
Three years on, tisso.de today still carries the foundation I designed in 2023, the structure, UI system, and visual language are still visibly the ones I built, even as the site has continued to grow around them.
- Cross-Team Collaboration: Worked closely with Ommax (UX) and BYKARB (branding) to align structure, visuals, and platform constraints.
- UX Input & Wireframe Review: Evaluated UX flows and helped refine wireframes to address missing interactions or clarity gaps.
- UI Design & System Creation: Built a full UI library, hi-fi wireframes, and a developer-ready Figma file with reusable components.
- Accessibility-Led Color Strategy: Adjusted brand yellow for contrast, and applied it selectively to protect brand equity without hurting usability.
This project highlighted the value of open, cross-disciplinary collaboration, especially in spotting what can fall between visual and structural decisions. I enjoyed supporting UX refinement with the Ommax team, while also creating a UI system that felt grounded in accessibility and brand integrity. Even with constraints, careful design and consistent communication helped the project move forward smoothly.