Setting

Real-estate marketplace responsive redesign

In Summer 2020, Setting, one of the leading office marketplace for startups, scaleups, and innovators in Berlin contacted me to redesign their website.

Working directly with the CEO, a UX Writer and the development team, we identified the main purpose of the redesign. Setting had become an established company and needed to communicate it to its clients, which had also changed throughout the years. Furthermore, processes needed to be automatized, so we started thinking how to simplify and automatize processes, internally and externally.

In Spring 2021 we launched a new design that communicated a more mature, established and complete service. We continue to develop features together.

Check the mobile wireframes in a basic prototype here and dive deeper into the process and desktop version furhter down the page.

Setting Design by Júlia Marí Bernaus

The Challenge

How can I help...

  • 01
  • Communicate the services to create new and better leads?

  • 02
  • Display the values and company culture to attract suited candidates?

  • 03
  • Transmit trust and value to the provided service?

Setting Design by Júlia Marí Bernaus

About Setting

Setting HQ is the leading office marketplace for startups, scaleups, and innovators. From world-renowned brands to local businesses, their mission is to identify a space that perfectly matches the company’s unique personality and culture—creating a custom solution for the team.

My Role

UX/UI Designer

Tools

Figma
Photoshop

Goal

To redesign seeting.io in order to:

  • Explain the new products and create new and better leads.

  • Communicate the mission, vision, values and company culture to attract suitable candidates.

  • Create an aesthetic website to transmit trust and the company’s maturity.

The Process

  • Talks with the CEO and various team members to understand the client’s motivations, the goals and vision of expected result

  • Understanding of the user types through conversations with the CEO and creation of proto-personas

  • Competitors Analysis

  • Creation of paper sketches

  • Creation of grey-scale wireframes of mobile and desktop pages (responsive website)

  • Applying UI to the wireframes

  • Prototyping mobile and desktop version

  • Putting together Design System

  • Hand-off to Developers

  • Defining tone, and pictures concepts to be taken by a professional photographer

  • Design revision hand-in-hand with developers

  • We continue to test, analyse and develop features, such as a better dashboard for internal and external purposes

Desktop Wireframes

Here you can see some of the wireframes for desktop. To Desktop Prototype

Setting Design by Júlia Marí Bernaus Setting Design by Júlia Marí Bernaus Setting Design by Júlia Marí Bernaus Setting Design by Júlia Marí Bernaus Setting Design by Júlia Marí Bernaus Setting Design by Júlia Marí Bernaus

Desktop Prototype

Although it was only required from me to build wireframes, I decided to build a simple prototype. The reason behind was that the sign up flow was unclear to me. Thanks to this, we discovered that the sign up flow and functionality needed to be changed and we removed it temporarily. Click on the blue areas to navigate through the prototype.

Design System

I created a Design System in a format that could be printed or sent to anyone who needed to make use of it. We have currently already used it for the photographer to understand the look & feel of the company. Use your right and left keyboard arrows to navigate through the Design System

Back to top