I helped a booming startup in the hotel industry switch to a mobile-first approach of their product. Check how hotels can make custom mobile apps for their guests.
Logic Moon is a new design agency, that needed a website and brand identity to showcase their competencies through digital channels. As they did not have many projects yet, the challenge was to visually align a few older projects and make them fit into the minimal black and white visual style.
The final deliverable is a responsive website that delivers a great experience across all devices and visual brand identity. Throughout the design process, I was asked to join the company, which I did as a Founding Partner & Design Manager.
Visit WebsiteThroughout a few iterations, the outcome of the project is a responsive website design that functions perfectly on all devices. I have developed the website as well using Webflow, a tool that allows for more advanced interactions and control over different screen resolutions.
Before the making of the website, the brand identity needed to be designed which outcomes can be found below. We decided to go for a timeless style that doesn’t grab too much attention as their work itself should stay in the spotlight. A recurring visual element is the ‘ink-drop’ that first stands for the impact of the company and then for the unfolding complexity of the context in which they design.
My role in this design process was of the UX/UI designer and front-end developer. Below I use the visualization of the Double Diamond to show wherein the process certain tools or methods were used, but as always, the process was more iterative than linear.
To kick off the project, several sketches were made. This was done to think freely, come up with ideas on how to structure the website, which pages and what kind of interactions could be used.
To structure the project, a sitemap was made. This is necessary to know how much content needs to be created and how the story of the website can be told. It also helped to condense the number of pages in order to keep it easy for visitors to navigate.
Several ideas were transformed into a more tangible form by creating wireframes. These are designs that are not too detailed yet; leaving room to iterate and change aspects on the way. We iterated a few times with the client to get the wireframes into a state we wanted to continue with.
.png)
After creating the wireframes, it’s getting more clear what kind of content is needed. The client wrote the text and I helped to get the text in the right format to fit the design. I created most of the new visuals and retouched old visuals to make everything aligned. This is often a tricky stage of a Web-design process, where several iterations are needed until the text and images have the right size, quality, tone and style to fit the design.
With the content being finalized, the wireframes could be transformed into the final design. Several changes were made at this stage, as the content is often different than placeholder elements of wireframes.
After the final design was approved, it was time to build the website. For this, I used Webflow; a tool that’s great for making sure the website functions perfectly on all devices. During the development, I enriched the site with several micro-interactions, such as button hovers, page-and scroll transitions.
The last step was to test the website by several people. Due to COVID-19, only 2 could be conducted in person, 6 were conducted digitally. During these tests, I wanted to validate the usability of the website, find out how people perceive the brand of the company and expose any bugs that might be present. The feedback was shared with the client, and a last round of tweaking led to the launch of the website.
A selection of Service Design, UX and UI projects.
