
MACHWERK
User Interface
The Client
GoVolunteer, a German NGO based in Berlin, connects volunteering projects and social initiatives with people who want to help.
The Context
GoVolunteer resides in Alte Munze, an old building not far from Alexanderplatz. They have a great space, which they turned into a coworking location, and share it with other NGO's. Since it is going great, they decided to create a website and I was handed the following brief.
The Objective
Design a simple yet unique landing page that would showcase Machwerk's cool, rough new co-working space as well as what it has to offer.
The Brief
-
3 Sections showcasing the space's main offers
-
A contact page with a contact form and a map
-
Dual language (English & German)
-
Has to fit Machwerk's new branding
-
Pixel-perfect, grid-based, B&W UI, large colorful pictures, large titles, clear structure
-
Responsive design (no need for tablet view- Google Analytics insight)
-
Infrastructure for future sub-pages and updates
The Team
I designed the website in close collaboration with GoVolunteer's Product Development team, which includes an Art Director (Leif Lobinsky), a Senior Fullstack (Marc Altmann), and another Frontend Developer (Davide Cannerozzi).
The Process
-
Research of other Berlin-based co-working spaces' websites
-
Wireframes, ideation, and iterations of the designs based on the CEO's and Art Director's feedback
-
Photoshoot of the space
-
Fonts research
-
Hi-Fi prototypes
-
Hand-off to developers
-
Launch set to end of August, future iterations planned
First digital wireframe

Moving to hi-fi
Iterated version, exploring styles

The Branding

The logo was designed by Leif Lobinsky

I created the style guide based on the brief and in collaboration with the Art Director
Final Version
