Emoji of a panda
Connor Bär

UWC Deutschland

A new online platform for the German UWC national committee.


UWC Germany selects students to study at one of the 17 United World College worldwide. I guided them through the process of recreating their online content, designed the new website, and developed a custom WordPress theme.





Deutsche Stiftung UWC

Screenshot of uwc.de

UWC Deutschland's previous website dated back to 2007, the year the original iPhone was introduced and three years before responsive web design became a core concept of web development. Over the years, the website's navigation structure had become a convoluted mess and the content was often outdated. So when I approached UWC Deutschland about a new website, they were excited to get started.

April — Meeting and Planning

We kicked things off with a brainstorming meeting at UWC Deutschland's office in Berlin. I guided the team through a series of short and focused exercises to quickly sketch out the goals and expectations for the project. Each exercise built on top of the previous one.

Target Groups

Everyone was tasked to identify three target groups that they deemed most important. We then combined the suggestions, discussed them in the group and boiled down the list to three main target groups:

  1. Potential applicants: young idealists looking to study abroad
  2. UWC as a movement: people looking for information on UWC (e.g. donors, parents)
  3. Alumni: former UWC students, teachers and parents

Before the meeting my girlfriend had written the title of every page that currently existed on the website on a sticky note. This helped the team to keep a visual overview as they combined and grouped the pages according to their target groups, until an overall structure emerged.

The result was remarkable: we reduced the number of pages from 232 to 37, intuitively sorted into 6 sections.

Post-it notes with features written on them hang on a wall
Post-it notes with page names written on them are grouped by category on a wall
Visualised navigation structure on the left, feature list on the right.


I had preselected a list of possible features to give the team a sense of what's possible. I also encouraged them to add further suggestions. The team then ranked the features by urgency and importance.

Content Management System

In preparation for the meeting I had researched and pre-selected three content management systems: CraftCMS, WordPress and Squarespace. I had also set up demo sites for each CMS so the team could try out and get a feel for the backend.

In the end the team decided to move forward with WordPress as it is open source, free, and has a large developer base.

May — Designing and Discussing

I spent the whole of May in Sketch drafting the design for the website. I shared my progress with the Berlin team through InVision where they were able to comment and discuss the mockups. They further shared the designs with members of the target groups. Their feedback in particular was extremely valuable and helped me to optimise the design further.

Initial mockup of uwc.de with a large, centered headline on a background image and content boxes below.
Second mockup of uwc.de. The headline is joined by a smaller subheadline, the content boxes are layed out using the golden ratio
Third mockup of uwc.de. The headline and subheadline have a white background for better legibility, and the logo in the navigation bar is larger
Final mockup of uwc.de. The white background has been replaced with a color gradient, the content is no longer boxed
Evolution of the homepage design.

In writing...