DirekteSport.dk, JFM

Helping 40.000+ users keeping up on local sport updates through news, sport results, incident lists and intuitive navigation.

Research

UX/UI design

Audit

User testing

Prototype

Workshops

The project

JFM’s local sport streaming service started out as JFM Play. After a rebranding and partial takeover by Amedier, it needed a redesign and rebranding. This was the beginning of DirekteSport.dk, a large scale rebranding and redesign of the entire website.

Along the redesign, a new intuitive navigation was designed, tested and implemented, alongside multiple features.

Creating an identity switch on the website, but keeping the core of the visual identity intact.

My role

UX/UI designer following the project from discovery to launch, as well as iterative testing and quality assurance.

Facilitator of kick-offs, feedback sessions, workshops and presentations of final product goals.

The process

  • Kick-off session with alignment of project scope, requirements, data on user needs, roles and timeline.
  • Competitor audit of news media and streaming sites.
  • Presentation of audit outcome + next step.
  • Wireframe sketching sessions for frontpage with stakeholders to determine the sites content.
  • Digital wireframes for frontage based on user needs, audit outcomes and stakeholder input.
  • Technical feedback session with developers on frontpage wireframe.
  • Presentation of wireframes for stakeholders.
  • Presentation of plan for usability test.
  • UI mockups for frontpage, alongside setup of user test; test script, prototype, etc.
  • Usability test on performance of new navigation and login, as well as understanding the complex organizational aspect of business context and the check out flow.
  • User test.
  • User test outcome presentation.
  • UI mockups iteration with minor adjustments based on user test outcomes.
  • Handoff in Figma to developers; proper documentation and mockups in Figma + presentation of final design.
  • Quality assurance of implemented design on stage environment + feedback to developers + create bug fix or enabler tasks in Jira.

Brand / Principles / Design system

Alongside the Marketing department, I contributed to the new switch in brand identity, but still keeping it recognizable with the darker JFM brand colours.

Even after the rebranding from JFM Play to DirekteSport.dk, the website still has subpages with light themed interface design. Part of my task was to secure elevation of the darker brand on our sites.

The design uses best practices and has focus on accessibility.

In collaboration with Marketing, and a UX Specialist, I helped build the foundation of the design guides, library and design system architecture.

Market research (audits)

To gain an insight in the competitive landscape of news and streaming sites, I conducted several audits.

Firstly, we wished to gain insight in the market, and who had the most intuitive design, navigation flow and content.

The outcome helped specify some simple demands for the upcoming interface design.

Prototype / Test

An interactive prototype was created in Figma in collaboration with a UX specialist.

It had to accommodate the journey of a user who needed to checkout and login.

A known problem was the users confusion of the subscription plan, the journey and flow, and the missing context of the company behind DirekteSport.dk.

The user test was conducted by GetWhy, and the test outcomes validated our suspicion to the suspected problem.

Design and delivery

The design is build upon stakeholder input, user needs, market research, technical feedback and outcomes from user test. Thus the design process was highly iterative, collaborative and transparent.

The delivery happens after the final demo of design where the design is presented to developers. The presentation took place in Figma where the developers also was presented with the necessary documentation about states, behavior, micro interactions, assets, etc.

After the delivery demo, the link for the Figma document is delivered to PO and designated developer.

QA has been part of my tasks, and I conducted the quality assurance before the design was released. The developers and I had several design reviews before release.

Let’s connect

Wanna get in touch for opportunities or just say hello?

LinkedIn Contact me Download resume