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.
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.
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.
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.
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.
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.
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.
After years of using a website template, Alex Waltl decided that it is time to invest in a custom design. He needed to stand out against his competitors as some of them were using the exact same template.
To not get in the way of the main attraction - the pictures themselves, we needed to keep the elements to a minimum and their appearance as simple as possible. Still this was a very crucial part of the project. These elements - in combination with the overall layout - are creating a brand feeling and making the design outstanding and individual.
I opted for simple geometrical shapes like the circle and crossing lines. Both elements are an abstraction of what can sometimes be found when looking through camera viewfinders.
As Alex is shooting for high-end magazines like "Vogue" and "Harper's Bazaar", it was clear to me that we needed to find a headline font which shows elegance like the classicist fonts used in the magazines logos.
The high contrast in line thickness of "Condor" reminds us of the classicist fonts while the extremely compressed sans serif style ads a modern touch.
After finishing the prototype in Figma, I used Webflow to build the online presence. This is an extremely straight forward way to bring websites to life without the help of a developer.
Webflow not only allows me to create fully custom designs without writing any code - it also makes it easier than ever for the client to maintain his website.
An important aspect of my work is always to create sustainable designs. Something that is easily adjustable by the client himself.
Webflow's Editor mode allows the user to just click on the websites texts and images for updating information and assets.
