WELT / Axel Springer

UX PRODUCT DESIGNER
My roles and responsibilities included conceptualising, ideation, testing, and visual design

Intro

Die Welt ("The World") is a German national news website, daily newspaper and TV station. It is the intellectual arm of Axel Springer SE, the largest digital publishing house in Europe. I had the great experience of being the primary Product Designer on the web team of welt.de where I got to conceptualize and design solutions to provide an exceptional user experience for a platform visited by millions of daily visitors.
‍
Through a true agile environment, my job was to solve problems presented to me by our product team, readers, editorial team and marketing team. I delivered solutions by working closely with our research team, product team, conceptualizing and prototyping solutions, all the way to high fidelity pixel-perfect designs following the Design Process steps.

The joy of this position was the diversity of its projects. I would like to highlight only a few of the many projects I worked on. 

Projects
01
Video Player CS
02
Stocks
01

Video Content & Live TV Stage

Video content and Live-TV are two fundamental offerings of WELT. Through qualitative research and conversations with internal stakeholders (editors and the product team), it is increasingly apparent that the former video stage is not yielding good viewership results. Most importantly, its current design does not expose the vast video content available on site. This video content is often trapped in articles and is often hardly recycled.

REQUIREMENTS

Rethink the video and live-tv experience on the homepage while maximising viewership and offering an exceptional user experience

Role: UX Design, UI Design.

Download Video Stage Full Case Study

Design Process

1. Empathy

goals

Examine current video content distribution and entry points on site
Identify user pain points
Gather available analytical video usage data
Conduct interviews with the editorial team to gather a deeper understanding of the issue

Outcome

Current tv stage promotes confusing UI and doesn't promote for video discoverability
No centralised place for video content that facilitates easy discoverability
Valuable video content is only accessible inarticles that expire once articles are no longerpresent on the news homepage

2. Definition

goals

Define core users, strategy and refine design goals
Facilitate a UX workshop with internal stakeholders(developers, editorial, product) to brainstorm and collect possible ideas, visions, wishes, features of a new video stage that are technically possible

3. Design Challenge

How Might We

Design a video stage that combines WELT Live-TV, video content, and paid content in an easy-to-use interface, allowing users to discover more and stay longer viewing video content.

4. Prototyping & Testing

After many sketches and low fidelity wireframes, the ideation process moved to a mid/high fidelity. Each iteration was an attempt to answer the findings we came across through our empathy phase, research, UX workshop and a reflection of the design goals and requirements previously set out by the product management team.

deliveries

Recognizable UI pattern offering a familiar browsing experience
The addition of video categories browsing bar showcasing a wealth of relevant video content per category, otherwise hard to access
More time spent on site while users can stay in the browser with no need to browse article pages to view video content

5. Outcome

After A/B testing, many case edges and insights were encountered. Several iterations were put forward.

The final design is now live on welt.de. It delivers on the design goals and the HMW statement while offering a more central yet dynamic player with an intuitive user experience.
‍
In addition, video discoverability is greatly improved. Additionally, navigation system combined with category additions has allowed WELT's editorial team to deliver fresh and relevant content utilizing the vast content otherwise lost from the homepage.

Results

3.85% improvement in overall video plays
Greatly improved user experience
Higher video advertising revenue
02

Stocks Integration & Backend Tools

WELT owns a reputation for delivering news content with a special focus on politics and the economy. To further deliver on its core value proposition, the introduction of live stock widgets was asked of the design team. The first part was to redesign existing stock widgets supplied by a third-party provider to fit our existing CI and find optimal positioning. The second part was design backend tools to generate stock widgets.

REQUIREMENTS

Think, design and introduce interactive stock widgets across the news website, while delivering an exceptional user experience. Additionally, design a backend tool to assist the editorial team in generating widgets based on editorial needs.

Role: Worked in a team of two as a UX & UI Designer.

Design Process

1. Stock Visuals

goals

UX exploration and competition review
Conceptual support to the editorial team on best UX practices in order to achieve thoughtful user engagement
Restyling dozens of different widgets and conform it to existing WELT style guide
Conduct interviews with the editorial team to gather a deeper understanding of the issue

Outcome

Current tv stage promotes confusing UI and doesn't promote for video discoverability
No centralized place for video content thatfacilitates easy discoverability
Valuable video content is only accessible inarticles that expire once articles are no longerpresent on the news homepage

2. Widget Generator Tool

Now that we have designed and understood the dynamics and properties behind the new Stock widgets, our job was to deliver a brand new interface acting as a URL generator.

Our primary user was the editors. The challenge was to create an interface that not only gets the job done but to dive deeper into the use case and deliver an intuitive tool for our new users. The final version you see here on the screen is the product of 3 different iterations.

deliverables

A full responsive user interface to generate stock URL's
A progress bar to assist new users to complete a journey
UI element design that greatly enhances the user experience
A live sticky preview mode to make visualising the widget easy
Ability to load older templates and easily customize them
URL copy button to insure link accuracy
Comprehensive style guide and UI library
03

Podcast Player

The podcast audience is growing. And with it, a demand for more dynamic, and interactive players. Our product team saw an opportunity in expanding beyond our traditional third part player to cope with growing demand and to additionally promote native shows that don't normally receive the attention needed.

The hope is to create an audio experience that captures listeners and keeps them browsing on-site for a longer time.

REQUIREMENTS

Design an interactive podcast player that expands content discoverability while increasing time spent on site.

Role: UX & UI Designer.

MORE LINKS

Bild

Park It