Source: https://alfonsmelander.se/disk-studentkar

# DISK studentkår · Case study by Alfons Melander

![DISK studentkar](https://alfonsmelander.se/assets/DISK-logo-C_WcKXkZ.svg)

A redesign of a student union website.

Role
UX & Front-end Developer
Timeline
Jun 2026-Aug 2026
Team
2 people

![DISK studentkar mockup](https://alfonsmelander.se/assets/DISK-mockup-CRvE30Fp.png)

Lightweight Discovery

## Defining the problem

Before redesigning the site, I did a lightweight discovery phase by asking students what they thought of the existing DISK website.

DSV has around 5,000 enrolled students each semester, with around 1,000 new students arriving every year. Because of that, the website needed to work especially well for first-time visitors who may not know what DISK is or where to begin.

The feedback was informal, but it revealed recurring usability issues. Some students did not know the website existed, while others described it as hard to navigate, cramped on mobile and inconsistent between Swedish and English.

![DISK studentkar environment](https://alfonsmelander.se/assets/disk-photography-BGIgq-UP.png)

Feedback synthesis

## Four issues to design around

Student feedback

### Low awareness

Some students did not know that DISK studentkår had a website.

### Confusing structure

Students who had used the site found it difficult to understand where information lived.

### Poor mobile experience

The existing website felt cramped and did not adapt well on smaller screens.

### Language inconsistency

Swedish and English content was inconsistent, and some pages had no English version.

Ideation

## Exploring the design

Figma

We explored different ways to make the content easier to scan and navigate. The early concepts focused on simplifying the structure and giving important student information more room on the page.

![Early Home Page](https://alfonsmelander.se/assets/DISK-early-concept-CtqSrEp2.png)

### Early Home Page

![Early page design](https://alfonsmelander.se/assets/DISK-early-foo-B190tkmd.png)

### Early page design

![Refined Direction](https://alfonsmelander.se/assets/DISK-refined-Czv9BIb_.png)

### Refined Direction

Information architecture

## Redesign decisions

The goal was to make the website easier to understand before users started reading in detail. We focused on clearer information hierarchy, more space around content and layouts that worked better across screen sizes.

We reduced the site structure from 25 pages to 16 by merging overlapping content and grouping related information together. This made the navigation easier to scan, reduced the number of dropdown items on mobile and created a structure that is easier to maintain in both Swedish and English.

Clearer page hierarchy
More breathing room in text-heavy sections
Responsive layouts for smaller screens
Navigation focused on common student needs

![DISK studentkar page structure before redesign](https://alfonsmelander.se/assets/DISK-pages-wiRdzxD7.png)

Before
![DISK studentkar page structure after redesign](https://alfonsmelander.se/assets/DISK-pages-after-Cqup45Gw.png)

After

Implementation tools

## Build stack

ElementorPHP

The redesign also had to work within the tools used to build the website. We kept the stack focused around Elementor and used supporting plugins where they solved a clear problem.

Elementor made it possible to build polished pages in a way the client could continue working with after handoff. For the parts that needed more control than the visual editor could provide, I supported the implementation with custom PHP.

![Elementor icon](https://alfonsmelander.se/assets/Elementor-Du3LcT-5.png)

### [Elementor](https://elementor.com/)

Used as the base for page building and the visual structure.

![ElementsKit icon](https://alfonsmelander.se/assets/Elemenskit-ClK5D7DQ.png)

### [ElementsKit](https://wordpress.org/plugins/elementskit-lite/)

Added more flexible UI blocks and widgets to the build.

![Ultimate Addons icon](https://alfonsmelander.se/assets/Ultimateadd-DSR-LXnv.png)

### [Ultimate Addons](https://wordpress.org/plugins/header-footer-elementor/)

Helped create reusable content sections across the site.

![TranslatePress icon](https://alfonsmelander.se/assets/Translate-BdBhvz2r.png)

### [TranslatePress](https://translatepress.com/)

Made it easier to manage Swedish and English content.

Final direction

## A clearer theme and identity

The final pages needed to feel like they belonged to the same organization, even when the content changed. I used consistent spacing, repeated section patterns and a more unified visual direction to make the website feel easier to recognize and trust.

![DISK Traditions page](https://alfonsmelander.se/assets/Traditions-CSINFSA3.png)

### Traditions

![DISK Sections page](https://alfonsmelander.se/assets/sections-CHf9F98K.png)

### Sections

![DISK Contact page](https://alfonsmelander.se/assets/contact-CSJJJcZD.png)

### Contact

## View the live website

The redesigned DISK website is live and maintained by the student union.

[Visit DISK](https://disk.su.se/)

[Next project](https://alfonsmelander.se/akademisk-kvart)

Alfons Melander

UX Designer · UX Engineer · Front-end Developer

[alfons@studiohackspett.se](mailto:alfons@studiohackspett.se) [LinkedIn](https://linkedin.com/in/alfons-melander)
© 2026 Alfons Melander
