ComX

Bringing a sales product to the next level

One <b>Product vision</b>

Work out an insight-driven product strategy and deriving quick wins

All-new <b>Design System</b>

New user interface design and collaborated with the backoffice team to ensure seamless integration

Sidekick: <b>New logo design</b>

We redesigned the logo to meet the new design.

Commercial Excellence GmbH

Visit website

INDUSTRY

Sales Operations

Timeframe

2021 / 22

TEAM

Design Consultant
Product Designer UX/UI
Backoffice

About the project

When the founders approached us, they expressed a strong desire to improve the product's user experience while also incorporating a variety of ideas for features that they had gathered through their daily business. To achieve this, we delved deep into the company's thinking and processes to find ways to transform their product into a simple yet highly relevant tool for sales professionals.

<section class="padding-largest no-padding-bottom module-portolio-detail-headline"> <div class="wrapper"> <h2 class="l-text center"> <span class="color">One vision</span> <br class="not-on-s">to align on a product future </h2> </div> </section> <section class="section modular-portfolio-detail-list"> <div class="wrapper portfolio-detail-list"> <div class="item flex-container reverse-order"> <div class="flex-item-left img-mobile"> <picture> <source media="(max-width: 767px)" srcset="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/02._tile-image-1/ComX-Tutorial--1x.jpg" /> <source srcset="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/02._tile-image-1/ComX-Tutorial--1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/02._tile-image-1/ComX-Tutorial--2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/02._tile-image-1/ComX-Tutorial--1x.jpg"> </picture> </div> <div class="flex-item-right"> <div class="vertical-middler"> <h3>Future vision –<br> for roadmap planning</h3> <p>The founders' goal was to build a prototype as quickly as possible in order to communicate the product's potential to investors and identify features for a roadmap. For that purpose, we created an outlook into future features and user experience</p> </div> </div> </div> </div> </section> <section class="padding-largest no-padding-bottom module-portolio-detail-headline"> <div class="wrapper"> <h2 class="l-text center"> <span class="color">Product optimization</span> <br class="not-on-s">in incremental steps </h2> </div> </section> <section class="section modular-portfolio-detail-list"> <div class="wrapper portfolio-detail-list"> <div class="item flex-container reverse-order"> <div class="flex-item-left img-mobile"> <picture> <source media="(max-width: 767px)" srcset="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX------Onboarding-dashboard-1x.jpg" /> <source srcset="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX------Onboarding-dashboard-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX------Onboarding-dashboard-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX------Onboarding-dashboard-1x.jpg"> </picture> </div> <div class="flex-item-right"> <div class="vertical-middler"> <h3>Quick wins –<br> to enable quick improvement</h3> <p>Speed is key when you are a startup. We helped ComX to put two quick wins out there fast: an updated dashboard and a improved user onboarding.</p> </div> </div> </div> </div> </section> <section class="section modular-portfolio-detail-list"> <div class="wrapper portfolio-detail-list"> <div class="item flex-container"> <div class="flex-item-left"> <div class="vertical-middler"> <h3>Refreshing the look&feel –<br> redoing the logo</h3> <p>Our objective was to provide the brand and user interface with a fresh and professional look, as well as create assets and components that would enable all future developments. Additionally, we shipped a new logo - as a cherry on top.</p> </div> </div> <div class="flex-item-right img-mobile"> <picture> <source media="(max-width: 767px)" srcset="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX--refreshing-brand-logo-1x.jpg" /> <source srcset="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX--refreshing-brand-logo-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX--refreshing-brand-logo-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX--refreshing-brand-logo-1x.jpg"> </picture> </div> </div> </div> </section> <section class="section modular-portfolio-detail-list"> <div class="wrapper portfolio-detail-list"> <div class="item flex-container reverse-order"> <div class="flex-item-left img-mobile"> <picture> <source media="(max-width: 767px)" srcset="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX---uxhaul-1x.jpg" /> <source srcset="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX---uxhaul-1x.jpg 1x, https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX---uxhaul-2x.jpg 2x" /> <img src="https://boanastudio.com/user/pages/04.cases/comx-ux-ui-design/04._tile-images-2-3/ComX---uxhaul-1x.jpg"> </picture> </div> <div class="flex-item-right"> <div class="vertical-middler"> <h3>UX-Overhaul –<br> the complete makeover</h3> <p>By applying the new features, navigation concepts and look&feel to other pages it became a rollout.</p> </div> </div> </div> </div> </section> <section id="cta-your-project" class="section padding-largest modular-call-contact "> <div class="wrapper"> <div class="flex-container"> <div class="flex-item-left"> <picture> <source media="(max-width: 767px)" srcset="/user/themes/boanastories/img/sales/s-profile-j2-mobile.jpg" /> <source srcset="/user/themes/boanastories/img/sales/s-profile-j2-1x.jpg 1x, /user/themes/boanastories/img/sales/s-profile-j2-2x.jpg 2x" /> <img src="/user/themes/boanastories/img/sales/s-profile-j2-1x.jpg" alt="Johannes Holl" /> </picture> <a href="https://boanastudio.com/team/johannes-holl" class="xs-text text-grey-60 image-caption"><b class="bold text-grey-40">Johannes Holl</b> <span class="not-on-s">• </span>Managing Director</a> </div> <div class="flex-item-right"> <div class="text"> <div class="headline l-text"> <span class="color">Let’s talk about</span><br>your project. </div> <div class="teaser n-text text-grey-60"> We can help reduce complexity and identify quick wins upfront. </div> <div class="actions"> <a href="https://boanastudio.com/contact" class="button primary">Get free consultation</a> </div> </div> </div> </div> </div> </section>