UI, UX, Redesign and Development
BKO is one of the most innovative and eco-friendly construction companies in Brazil. They take pride of being a “pleople centered” company and they won many awards for innovation, sustainability and employee welfare. They build highly technlogical, smart and eco-friendly apartments with features such as smart doors, biometric acess, smarts screens on the elevators, rain water reutilization, double flush toilets and so on.
But their website was not so friendly, confusing and not effective in showing and selling apartments. It didnt show the company’s commitment with both its employees nor with innovation and sustainability. It didn’t list all the apartments and buildings innovative and sustainable features. On top of that, there were no well placed CTAs for chat with a agent or to receive more info about a specific product.
They wanted a site that was both corporate and “seller”.
So my idea was make a home page that showed the company’s filosophy, their commitment with sustainability and innovation and their developments, so both the Marketing and the Sales teams would be satisfied.
I started to sketch a wireframe that would gradually tell a story that shows:
1. Wo they are > 2. What they think > 3. What are the’re products > 4 .What is their differentials
With the wireframes approved I went on to the layout
Using BKO’s collor palette I started designing the layout, and I decide not to use buttons ons CTAs to pages and products, since every part of the page has it’s own link. So instead os making buttons, the are like text links, but transform into a button when hovered. This is the layout I came up with.
For BKO, the most important page for selling is the Development page
This page should be able to function as a Landing Page for the Google and Facebook campaigns, so it must have all the details os the Apartment and the development, but also, should all be positioned in a for where CTAs were allways visible.
First I divided the page into 7 big important interest areas:
Video > Summary > The Apartment > Feature ( of the building ) > Floor Plans > Location > Construction progress
In order to leave the design clean, since it is such a big page, with lots of content, I used the CTA options as a divider between sections, so the page didn’t get visually polluted or confusing. Here’s my ideia:
And with all these important nuances in mind, I started the design
What I wanted was to leave everything as clean as possible so the layout didn’t get crowded…also using the CATS as dividers, I didn’t need to put buttons everywhere. Here’s the result: