I need to show two different brands in same website. Each has a different logo and navigation which should be visible by default, but they share a common sign-in/sign-up interface and currency change dropdown. Some people have suggested tabs but I don't think tabs work well on small screens.

Despite having two brands on the same screen I need to maintain separation of content and navigation and the idea should work on both desktop and mobile screens. I have seen some examples like diapers.com but that's a fixed width website and also that has lots of brands while I need to show only two.

  • 2
    Have a look at how web agency Headscape have handled the co-brand of Headscape and Boagworld. They even wrote a blog post about the design challenges. It's a responsive site too. – JonW Oct 22 '14 at 9:02
  • @jonw Thanks for sharing. They have used Hamburger menu even in desktop mode and in their design it's not even clear either we are on Headspace section or Boagworld. Mine is an e-commerce website i need to show selected one and the separation clearly. – Jitendra Vyas Oct 22 '14 at 10:02
  • They only use the hamburger once you've scrolled down as they use it as part of a fixed header. It's a standard menu when you're at the top of each page. Even on mobile. It may not be perfect, but it is an example that seems directly similar to your situation. – JonW Oct 22 '14 at 10:07

Recently I had the same problem - two brands and one domain.

We solved it by using a splash-screen which introduced the two brands to the users who came through the home page. On the rest of the pages we added a simple text based link to the other brands website in the upper left corner. It took up minimal space and it didn't interfere with the rest of the interface. We used a hamburger menu for mobile and embedded the link inside that menu but also in the footer.

Both sites were e-commmerce sites and shared a lot of back end functionality but the controls were designed to blend in with the overall visual design of each of the brands.

Our user research showed that people had no problem navigating between the sites.

When we looked at other sites the most common solution were to use a network menu at the top of the web site which is pretty much the same as Diepers.com

Other solutions were to build a site framework that included several brand into the main navigation - for example www.gant.se (Gant Home and Gant Rugger is two sub brands to Gant) and designed the different brands sub sites according to their own identities. That way the sub brands could share the content and the functionality that isn't unique to them.

  • can you give the link of websites you have mentioned? – Jitendra Vyas Oct 27 '14 at 12:56

Why not just split your navigation area (like the header) in half. Left-align one brand, right-align the other brand, and have the navigation effects appear when you click on the brand's png/logo.

[supersweet-cookies] <click for menu           click for menu>[deliciousdank cookies]
[                                                                                   ]
[                                                                                   ]
[             rest of the    page                                                   ]
[                                                                                   ]
[                                                                                   ]
[                                                                                   ]
[                                                                                   ]
[                                                                                   ]
  • thanks for the -1, you may explain yourself if you have the courage to do so – sova Feb 20 '15 at 16:21
  • How does this account for the "rest of the page"? The navigation structure might cater to options and nav items for both entities however what do you do for the 'rest of the page' content? Unless the content is a mixed explanation of both supersweet-cookies and deliciousdank, a splash page or some kind of universal text, I just dont see this option working. Perhaps I'm missing something in your answer. – master Feb 25 '15 at 16:11
  • Splash page is a good idea. The menus control the content. Up to the implementer to decide what the default is. – sova Feb 25 '15 at 23:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.