Following the design thinking process I am creating digital products with a human centered design approach.
The briefing was pretty straight forward: Spreeformat needs a new web appearance which represents them as the design company they are.
The time constraints were set pretty harsh so we agreed on just changing the overall look and feel of the current website.
UX/UI Design &
During our first meeting I learned that getting good employees in the architecture business is hard. For this reason the website has to speak to potential clients (B2B & B2C) as well as potential employees.
Our Persona Tina is a 23 year old millennial who is studying architecture. Right now she is busy searching through all of Berlins architecture studios to find out which one she wants to apply to.
As a millennial Tina is used to fast consumption of web content. Her goal at the moment is to click through a few projects of every studio.
It was important to reduce this flow to the most important steps and make the projects easily reachable from every point of the website.
To attract young professionals Spreeformat needed a state of the art design for their website that reflects their studio in the best way possible.
After a first call and going through the clients online portfolio I tried to summarize the studios main values.
Based on these I created a moodboard which we discussed and agreed on during our first meeting.
Spreeformat is a design company
Full disclosure of the project process
Building spaces is a serious business that requires competence
The overall light and exquisite feeling is created by the use of a lot of whitespace. It was important to give the images enough room to unfold their aesthetic potential without any distractions.
As architecture is all about constructed geometric lines and perspectives I aimed to counteract the strictness by using an open grid on which the pictures are able to float through the white space.
Creating a state of the art design also means following trends. I did so in treating the headline font as a style element. In addition to Avenir, their corporate font, I opted for Conglomerate — a strong and bold font with rough edges that adds character to the design.
An architectural project always comes with a lot of construction drawings. As transparency is one of the studios core values these drawings are incorporated in every project page.
I also created a set of geometrical forms — abstractions of architectural elements such as stairs or more particularly for the studio: an abstraction of the panorama rotunda. These forms are loosening up the strictness of an all white background.
This important page ought to feel like an exhibition of curated projects. Each represented with a teaser image that follows a calm and muted color scheme.
Here the transparency value finds its visualization in behind the scenes graphics and detail shots with material descriptions.
Scrolling through a project a button appears on the right corner with a shortlink to the next project. This provides our persona Tina with the needed flexibility to browse through the whole portfolio.
I found the existing pictures for this Pergamon museum project to generalized and missed seeing the effort and the attention to detail the architects invested into the project.
I wanted people to be able to see and feel the bigger picture.
So I spontaneously decided to go to the museum and catch the spirit by myself. I took ten detail shots of objects and corners which are shown on the project page.
After working on their branding and graphic design material for the studio launch the team asked me to redesign their website after a successful first year.
Every Damn Day Yoga
The Every Damn Day Yoga studio is a place where you can find Berlin business moms and young urban people alike.
On a scale from Hippie to Hipster the target group in Berlin Friedrichshain is definitely more on the Hipster side. A state of the art branding and web appearance was a must.
I learned from the team that they often have a problem with people not being on time. Running a tight schedule starting classes on time is a very important aspect for the studio to function.
To make this message pop I placed it very prominent on the homepage. The usage of big typo with a scroll animation turns it into a style element of the website.
I created this one by the time I did the branding for the studio. A reduced, minimalistic and calming tonality for a place of peace within a busy city like Berlin.
Yin & Yang - Keeping your inner balance. Especially during these times of hyperstimulation we are searching for some calm reflection time.
Yoga is all about a mindful treatment of your body. So I had to create a calming and lighthearted brand feel.
The studio is a place of calm in a busy city.
Palm leave shadows in combination with the sandy primary color spread some tropical Bali vibes to emphasize this oasis like feeling.
Meeting the target group in the best way possible the elements and interactions had to be stylish and innovative yet easy to use.
I tried to get the most out of Webflow and implemented scroll effects as well as hover menus.
For changing the studios online appearance instagram was a crucial part we couldn't ignore. It had to fit the new tonality With followers consuming content on a daily basis this channel is the most important factor to build brand awareness.
The new feed had to go beyond yoga class announcements and studio pics.
Topics like mindfulness, positive attitude and body awareness - all associated with the yogi lifestyle - are part of the new content strategy which we transport with casual wording.
With a mix of reposted mood pictures and graphic posts we create a clean, aesthetically appealing but yet professional look which transports the new tonality in the best way possible.
The challenge of this project was to create an editorial platform from scratch by taking into account the needs of a predefined persona.
The deliverables for this sprint: desktop and mobile version of 3-4 screens.
5 days Sprint
Frederike Asmussen & me
How might we provide Paula with inspiration and artist insights on one platform?
After a day full of research we decided to create an online platform that offers both inspiration and stories that would give the user an insight into the artists lives.
We came up with a fast logo and a short brand story. The logo element shows an abstraction of a window.
The honest imagery provides an authentic insight into the artists lives.
Minimalistic design elements give the users a feeling of clarity within the creative chaos in their heads.
The two main user flows led us to a division into two sections on the website - fast inspiration & longer reads.
After some lo-fi sketches we went into mid-fi wireframing.
This helped us to decide for example over two different possibilities to show the inspirational section of the platform.