Antje Dieckhoff

Projects
About
Resume
hi@antjedieckhoff.com

Antje Dieckhoff

Antje Dieckhoff

Projects
About
Resume

University of Siegen

Putting Users First: A Website Redesign Focused on Key Target Groups

Project Type

Web development, B2C
Contract (employed by mc-quadrat, cooperation with Progressive Digital)

Role

UX Researcher & UI Designer

Team

Strategic Consultant

Senior Project Manager

Brand Consultant

Senior UI Designer

UI/UX Designer

Timeline

6 months, 2024, part-time

The University of Siegen is a medium-sized university in North Rhine-Westphalia with around 15,000 students, most of whom are based in the region. As student numbers have been declining for several years, the university also wants to attract prospective students from outside the region.

The website plays a key role in attracting students, but an outdated CMS hindered usability and failed to reflect the university at its best. The aim of the website redesign was to create a website that is intuitive to use, also for editors, and has a contemporary look that presents the university in an attractive way for the key target groups.

Tools

Figma

Confluence

Jira

Google Forms

MS Teams

Responsibilities

User Research
Information Architecture

Wireframing/ low-fidelity design

Supporting prototyping & high-fidelity design

Impact & Output

Improved Findability and Discoverability of Relevant Information

Ensuring a user-centered design approach

User research clarified the needs and expectations of key target groups.

Insights from user interviews informed the creation of personas and user journeys, which served as a foundation for designing the navigation structure, wireframes, and ultimately the high-fidelity designs.

Enhanced information accessibility and usability

We made essential information easier for key audiences to find and use.

By simplifying navigation, optimizing the information architecture, and tailoring content to specific target groups, we made it easier for key audiences like prospective and current students to find what they need. Key features include a study program search and a student services search.

KPIs to measure impact

Since my involvement ended before usability testing and the website launch, I have no access to metrics. However, I recommended tracking:

Conversion rate of prospective students, indicating improved attractiveness and usability of the university website

Performance metrics like Task Time, Completion Rate, and Number of Errors, reflecting improved usability

Satisfaction scores like Single Ease Question (SEQ) or NASA Task Load Index (NASA-TLX), measuring subjective user perception

Problem

The Website Lacked an Attractive Appearance and Intuitive User Guidance

Outdated structure and navigation challenges

The website no longer met modern standards.

The outdated CMS (XIMS) and decentralized editorial responsibilities across university units caused the site to grow to over 100,000 subpages. This, paired with unintuitive navigation, made it difficult for users to find relevant information.

  • Cluttered home page

    Side navigation, top navigation, quickstart buttons and an image slider that looks like another navigation… The way the home page was set up made it difficult for users to find what they were looking for.

  • Unattractive UI design

    The content was very text-heavy, often without emphasis, making reading and comprehension harder. The CMS also had an outdated visual style, giving the website an old-fashioned appearance.

  • Inconsistent faculty pages

    Each faculty had their own color scheme and logo. As each faculty could decide which information to present and how, the navigational structure as well as the content varied greatly across faculties.

  • Different logos, different menus

    Some pages still used an old version of the university logo, further weakening a coherent brand presence. Top and side navigation also changed depending on the current page, making orientation difficult.

  • Extremely information-dense pages vs. link lists

    While some pages seemed to try and pack as much information into as little space as possible, others functioned more as information hubs, listing links to other pages that contained more detailed information.

  • Cluttered home page

    Side navigation, top navigation, quickstart buttons and an image slider that looks like another navigation… The way the home page was set up made it difficult for users to find what they were looking for.

  • Unattractive UI design

    The content was very text-heavy, often without emphasis, making reading and comprehension harder. The CMS also had an outdated visual style, giving the website an old-fashioned appearance.

  • Extremely information-dense pages vs. link lists

    While some pages seemed to try and pack as much information into as little space as possible, others functioned more as information hubs, listing links to other pages that contained more detailed information.

  • Different logos, different menus

    Some pages still used an old version of the university logo, further weakening a coherent brand presence. Top and side navigation also changed depending on the current page, making orientation difficult.

  • Inconsistent faculty pages

    Each faculty had their own color scheme and logo. As each faculty could decide which information to present and how, the navigational structure as well as the content varied greatly across faculties.

  • Cluttered home page

    Side navigation, top navigation, quickstart buttons and an image slider that looks like another navigation… The way the home page was set up made it difficult for users to find what they were looking for.

  • Unattractive UI design

    The content was very text-heavy, often without emphasis, making reading and comprehension harder. The CMS also had an outdated visual style, giving the website an old-fashioned appearance.

  • Inconsistent faculty pages

    Each faculty had their own color scheme and logo. As each faculty could decide which information to present and how, the navigational structure as well as the content varied greatly across faculties.

  • Different logos, different menus

    Some pages still used an old version of the university logo, further weakening a coherent brand presence. Top and side navigation also changed depending on the current page, making orientation difficult.

  • Extremely information-dense pages vs. link lists

    While some pages seemed to try and pack as much information into as little space as possible, others functioned more as information hubs, listing links to other pages that contained more detailed information.

  • Cluttered home page

    Side navigation, top navigation, quickstart buttons and an image slider that looks like another navigation… The way the home page was set up made it difficult for users to find what they were looking for.

  • Unattractive UI design

    The content was very text-heavy, often without emphasis, making reading and comprehension harder. The CMS also had an outdated visual style, giving the website an old-fashioned appearance.

  • Inconsistent faculty pages

    Each faculty had their own color scheme and logo. As each faculty could decide which information to present and how, the navigational structure as well as the content varied greatly across faculties.

  • Different logos, different menus

    Some pages still used an old version of the university logo, further weakening a coherent brand presence. Top and side navigation also changed depending on the current page, making orientation difficult.

  • Extremely information-dense pages vs. link lists

    While some pages seemed to try and pack as much information into as little space as possible, others functioned more as information hubs, listing links to other pages that contained more detailed information.

Designing a modern and inclusive university website

The redesign aimed to increase attractiveness for key audiences.

The goal was to create an intuitive, visually appealing website for editors and users alike. Key requirements included implementing the site on Drupal, accommodating multilingual content, and ensuring accessibility compliance.

Project Setup

Close Collaboration Between Communications Consultancy, Technical Service Provider and University Project Team

A strong partnership ensured a user-focused concept

We made sure the redesign reflected the university’s brand while meeting audience needs.

The University of Siegen brought in a partnership of digital agency and communications consultancy for the redesign. The communications consultancy led the website concept and corporate design evolution, and I joined them to focus on understanding audience needs to ensure a user-centered approach.

Due to the website's complexity, the redesign took place in three phases

As part of the communications consultancy team, I was only involved in the first phase.

Phase 1

Website concept focusing on the key target groups. Providing a set amount of templates for use by the university editorial team. New pages link to content on the old website.

Phase 2

Implementing more templates to replace content from the old website. Old and new websites still operated in parallel.

Phase 3

All content has been replaced. Old website is no longer available; redesign complete.

Combining strengths

Close coordination ensured alignment between technical implementation and user-centered design.

I collaborated closely with the technical team and university stakeholders, ensuring smooth communication via weekly meetings and thorough Confluence documentation.

💡

Side note

Universities are complex organizations with many stakeholders. To boost acceptance of the new website, we involved key committees and offered feedback formats beyond the core project team.

💡

Side note

Universities are complex organizations with many stakeholders. To boost acceptance of the new website, we involved key committees and offered feedback formats beyond the core project team.

💡

Side note

Universities are complex organizations with many stakeholders. To boost acceptance of the new website, we involved key committees and offered feedback formats beyond the core project team.

Challenges

Ensuring User Centricity, Brigding Technical Knowledge Gaps, Adapting to Project Changes

Adapting to diverse needs in a complex project

Balancing the demands of user groups, editors, and a new CMS, while managing a challenging project scope, required clear communication and flexibility.

User centricity beyond key target groups

The website was optimized for five key visitor groups, and I conducted surveys to understand their needs. However, editors had different requirements, and since no surveys were planned for them, we had to rely on feedback sessions and assumptions to address their challenges.

User centricity beyond key target groups

The website was optimized for five key visitor groups, and I conducted surveys to understand their needs. However, editors had different requirements, and since no surveys were planned for them, we had to rely on feedback sessions and assumptions to address their challenges.

User centricity beyond key target groups

The website was optimized for five key visitor groups, and I conducted surveys to understand their needs. However, editors had different requirements, and since no surveys were planned for them, we had to rely on feedback sessions and assumptions to address their challenges.

No prior knowledge of Drupal

Since I had never worked with Drupal before, I wasn't sure how to best enable editors to build and design pages. To mitigate this challenge, I communicated frequently with the technical team.

No prior knowledge of Drupal

Since I had never worked with Drupal before, I wasn't sure how to best enable editors to build and design pages. To mitigate this challenge, I communicated frequently with the technical team.

No prior knowledge of Drupal

Since I had never worked with Drupal before, I wasn't sure how to best enable editors to build and design pages. To mitigate this challenge, I communicated frequently with the technical team.

Coordinating goals and deadlines effectively

There was a clear end goal, but flexible requirements along the way. We had to clarify what should be achieved in each project phase and set our own goals. I also took on project management tasks, like coordinating schedules, tracking deadlines, and flagging bottlenecks.

Coordinating goals and deadlines effectively

There was a clear end goal, but flexible requirements along the way. We had to clarify what should be achieved in each project phase and set our own goals. I also took on project management tasks, like coordinating schedules, tracking deadlines, and flagging bottlenecks.

Coordinating goals and deadlines effectively

There was a clear end goal, but flexible requirements along the way. We had to clarify what should be achieved in each project phase and set our own goals. I also took on project management tasks, like coordinating schedules, tracking deadlines, and flagging bottlenecks.

UX Research & Findings

Research-Driven Persona Development to Address User Needs and Pain Points

When I joined the project, five key target groups had already been selected

  • Prospective students

  • Current students

  • Researchers

  • Cooperation partners

  • Employees

❞

The 90s called and want their website back.

Three different interview participants used this exact wording.

A two-tiered research process

to better understand user expectations, needs and pain points regarding the website.

First, I conducted student interviews. In the second step, I interviewed key connectors – university members who frequently interact across core target groups due to their role – as well as newly appointed professors as representatives of the researcher group.

10

interviews with current students

10

interviews with current students

10

interviews with current students

3

interviews with newly appointed professors

3

interviews with newly appointed professors

3

interviews with newly appointed professors

5

expert interviews with key connectors

5

expert interviews with key connectors

5

expert interviews with key connectors

💡

Side note

The interviews largely confirmed our assumptions: The website is difficult to navigate, information is hard to find and content is not presented in an appealing way.

💡

Side note

The interviews largely confirmed our assumptions: The website is difficult to navigate, information is hard to find and content is not presented in an appealing way.

💡

Side note

The interviews largely confirmed our assumptions: The website is difficult to navigate, information is hard to find and content is not presented in an appealing way.

Interview analysis resulted in creation of personas

I conducted the interviews remotely via MS Teams and analyzed the results through Affinity Mapping.

I recorded the interviews, identified key insights, and prepared the student interview highlights for other uses, e.g. by the marketing team. Based on the findings, I created personas and user journeys. Some core target groups revealed multiple personas.

I distilled the essence of each persona into a few sentences.

Check out the condensed personas below :)

I had to prioritize what to show in this case study and in how much detail. As I spent a significant part of the project gathering information to create the personas, I could talk about them for days. I'm happy to answer any question you might have :)

  • Prospective students

    Clear guidance on study programs and university life is essential, as prospective students tend to feel overwhelmed when choosing a program, as they compare many different universities and courses. Confusing navigation and incomplete information further complicate the decision-making process.

  • Beginning students

    At the beginning of their studies, students face major changes and uncertainty, not knowing what to expect as they are entering this new phase in their lives. The website must present all essential information for starting their studies in a clear and accessible way.

  • Advanced students

    Students in higher semesters visit the website only for specific needs, like checking next semester’s lecturers. They feel underinformed about relevant news and events outside their program, as they rarely see the homepage, relying mostly on Google Search.

  • Researchers

    While showcasing their work impressively and attracting international audiences is important to researchers, content management is often handled by others. Researchers view strict design rules as limiting, however, they consider flexible structures and templates helpful.

  • Research position applicants

    Researchers looking to apply at the university need details on the chair, team research focus, and courses to identify potentials for their own contributions. Inconsistent department and chair pages make navigation difficult – a unified structure is needed.

  • Cooperation partners

    Potential partners seek collaboration opportunities with various professors. They especially value personal contact and therefore need to quickly find the contact details of key persons. Currently, the website offers little guidance.

  • Employees

    Staff currently use a service portal which is perceived as cluttered and unintuitive. Services are split into sub-portals, making forms hard to find when they don’t fit neatly into one category. A search function to filter services would make employees' lives easier.

  • Prospective students

    Clear guidance on study programs and university life is essential, as prospective students tend to feel overwhelmed when choosing a program, as they compare many different universities and courses. Confusing navigation and incomplete information further complicate the decision-making process.

  • Beginning students

    At the beginning of their studies, students face major changes and uncertainty, not knowing what to expect as they are entering this new phase in their lives. The website must present all essential information for starting their studies in a clear and accessible way.

  • Advanced students

    Students in higher semesters visit the website only for specific needs, like checking next semester’s lecturers. They feel underinformed about relevant news and events outside their program, as they rarely see the homepage, relying mostly on Google Search.

  • Researchers

    While showcasing their work impressively and attracting international audiences is important to researchers, content management is often handled by others. Researchers view strict design rules as limiting, however, they consider flexible structures and templates helpful.

  • Research position applicants

    Researchers looking to apply at the university need details on the chair, team research focus, and courses to identify potentials for their own contributions. Inconsistent department and chair pages make navigation difficult – a unified structure is needed.

  • Cooperation partners

    Potential partners seek collaboration opportunities with various professors. They especially value personal contact and therefore need to quickly find the contact details of key persons. Currently, the website offers little guidance.

  • Employees

    Staff currently use a service portal which is perceived as cluttered and unintuitive. Services are split into sub-portals, making forms hard to find when they don’t fit neatly into one category. A search function to filter services would make employees' lives easier.

Wireframing & Prototyping

User-Centered Website Concept with Optimized Navigation and Content

Website concept tailored to key target groups

Our concept allows key target groups to quickly access relevant information from the homepage.

The homepage serves as a gateway to target group-specific sections, with the focus alternating based on the academic calendar – e.g., during application periods, it prioritizes prospective students, and at semester start, it highlights information for new students.

Content overview from research outcomes

I created an overview of relevant content for each target group to inform the information architecture.

Using interview results, personas, and user journeys, I mapped the entry points to specific content. I determined what would be each target group's most important keywords and how they would be linked to one another.

💡

Side note

In the first step, I used an Excel sheet, followed by a Confluence whiteboard, and then wireframes in Figma to determine which content should appear on which pages. Each tool helped refine my approach.

💡

Side note

In the first step, I used an Excel sheet, followed by a Confluence whiteboard, and then wireframes in Figma to determine which content should appear on which pages. Each tool helped refine my approach.

💡

Side note

In the first step, I used an Excel sheet, followed by a Confluence whiteboard, and then wireframes in Figma to determine which content should appear on which pages. Each tool helped refine my approach.

Wireframing and UI design

I created wireframes and low-fidelity designs in Figma to guide the Senior UI Designer.

In Figma, I detailed over 30 pages through wireframes. After client approval, I refined the structure with low-fidelity UI designs to ensure the Senior UI Designer knew exactly how to implement the high-fidelity UI design.

Sounds like a straight-forward, linear approach?

Actually, a lot of things happened at the same time:

I created wireframes.

The Senior UI Designer developed the design system.

I translated the wireframes into low-fidelity UI designs.

The Senior UI Designer created the high-fidelity design.

  • I created wireframes.

    The Senior UI Designer developed the design system.

    I translated the wireframes into low-fidelity UI designs.

    The Senior UI Designer created the high-fidelity design.

  • I created wireframes.

    The Senior UI Designer developed the design system.

    I translated the wireframes into low-fidelity UI designs.

    The Senior UI Designer created the high-fidelity design.

I implemented further high-fidelity sites

based on components that the Senior UI Designer had designed.

Unfortunately, I can’t show any designs as they are under NDA.

I developed a navigation structure

based on wireframes and information architecture, ensuring quick access to key pages.

I divided menu items into a mega-menu and fat footer to address various navigation needs. Combining my proposal with an alternative suggestion from the technical service provider, I finalized the menu items through client feedback.

Significant navigational improvements

that make it easier for users to find what they’re looking for

Mega-menu reflects the key target groups' labels, making it easy to find relevant information

Fat footer lists additional important information and makes it easy to access, regardless of the currently visited page

Consistent menu across pages strengthens branding and boosts user confidence with a cohesive experience

Logo remains consistent and is supplemented with a faculty logo on faculty pages to improve orientation

Next steps

Usability Testing as well as CMS and Content Training for Editors Before the Launch

Essential measures

to ensure the project's success

To make sure that visitors will find what they're looking for on the website, it's not only important to conduct usability testing but also to enable editors to create an attractive and representative presence for their respective areas of responsibility.

👀

Usability testing

to identify areas for improvement, ideally before the initial launch, but at the latest during the second phase

👀

Usability testing

to identify areas for improvement, ideally before the initial launch, but at the latest during the second phase

👀

Usability testing

to identify areas for improvement, ideally before the initial launch, but at the latest during the second phase

🖥

Training in Drupal

to prepare editors to work efficiently with the new CMS and manage website content effectively

🖥

Training in Drupal

to prepare editors to work efficiently with the new CMS and manage website content effectively

🖥

Training in Drupal

to prepare editors to work efficiently with the new CMS and manage website content effectively

📝

Guidance on content best practices

to ensure greater consistency and clarity across the website

📝

Guidance on content best practices

to ensure greater consistency and clarity across the website

📝

Guidance on content best practices

to ensure greater consistency and clarity across the website

Recommended KPIs

To ensure that we as project partners have made the right decisions in the design process, I recommended tracking:

Conversion rate of prospective students

Task Time, Completion Rate, and Number of Errors

Single Ease Question (SEQ) or NASA Task Load Index (NASA-TLX)

Learnings

Effective Research, Clear Communication & Up-to-Date Documentation: Lessons Learned for Future Projects

Project Takeaways

This project has taught me a few things about myself and the way I work:

User interviews are fun for me

I enjoy asking questions and gaining insights into different user groups. However, deriving insights from the interviews was very time-consuming. In the future, I would leverage AI tools. This time around I didn't have enough time to identify a suitable tool.

User interviews are fun for me

I enjoy asking questions and gaining insights into different user groups. However, deriving insights from the interviews was very time-consuming. In the future, I would leverage AI tools. This time around I didn't have enough time to identify a suitable tool.

User interviews are fun for me

I enjoy asking questions and gaining insights into different user groups. However, deriving insights from the interviews was very time-consuming. In the future, I would leverage AI tools. This time around I didn't have enough time to identify a suitable tool.

Communication is key to collaboration

Everything depends on good communication between all project participants – it is better to communicate too much than too little to ensure that everyone is on the same level of knowledge.

Communication is key to collaboration

Everything depends on good communication between all project participants – it is better to communicate too much than too little to ensure that everyone is on the same level of knowledge.

Communication is key to collaboration

Everything depends on good communication between all project participants – it is better to communicate too much than too little to ensure that everyone is on the same level of knowledge.

Keeping documentation clear is vital

A documentation tool like Confluence is invaluable, but it needs a system to distinguish outdated from current information. This ensures clarity, especially for those who join the project later.

Keeping documentation clear is vital

A documentation tool like Confluence is invaluable, but it needs a system to distinguish outdated from current information. This ensures clarity, especially for those who join the project later.

Keeping documentation clear is vital

A documentation tool like Confluence is invaluable, but it needs a system to distinguish outdated from current information. This ensures clarity, especially for those who join the project later.

Content

Overview

Impact & Output

Problem

Project Setup

Challenges

UX Research & Findings

Wireframing & Prototyping

Next Steps

Learnings

Next project

KOKO Terapi & Sexologi Website Design

Next project

KOKO Terapi & Sexologi Website Design

Next project

KOKO Terapi & Sexologi Website Design

Need a designer?
Let’s chat!

Get in touch

Made with Framer

Resume

Email

LinkedIn

Legal notice

©

2025 Antje Dieckhoff

Need a designer?
Let’s chat!

Get in touch

Made with Framer

Resume

Email

LinkedIn

Legal notice

©

2025 Antje Dieckhoff

Need a designer?
Let’s chat!

Get in touch

Made with Framer

Resume

Email

LinkedIn

Legal notice

©

2025 Antje Dieckhoff