DJ Tunez Website
Redesigning for Restrictive Web Implementation.
Role
UX Designer, UX Researcher
Project Length
1 week, 3 days (2022)
Solution Type
Website
Software(s) Used
Figma
Result
Hi-Fi UI Design, Style Guide
Implementation
The Overview
So, my client DJ Tunez hits me up, saying something along the lines of, “Yo, i’m thinking it’s time to revamp my website. Can you handle it? Oh, and by the way, I’m all about WordPress, but I want a more personalized design. And, yeah, I’m not keen on dropping cash on premium plugins either.” Translation? He wants a slick redesign without breaking the bank.
DJ Tunez’s website is the hub for all of his musics, videos, tour dates, and, of course, links to buy those coveted show tickets.
He’s after a website facelift, wanting better looks and smoother experience but then, i have to design the website keeping in mind that its going to be implemented using WordPress, the free Elementor (a wordpress page builder), and OceanWP (the no-frills WordPress theme).
Well, challenge accepted.
The Problem
Let’s talk about the old website. It had its fair share of issues, from how it worked and looked to the way information was laid out. Here’s the lowdown on what needed fixing:
- The overall functionality and aesthetics weren’t cutting it.
- The website’s information architecture was messy.
Some integral problems to be looked at and improved on from the previous website are illustrated below:
The main challenge here, like mentioned earlier is that we’re working within some tight restrictions for the design’s implementation. We’re sticking to WordPress, using a free theme (OceanWP), and a free page builder (Elementor). No custom themes or paid plugins.
But despite these limitations, our mission remains unchanged; creating a design that nails both functionality and aesthetics. It’s a bit of a balancing act, but its very workable.
The Design Process
I did some digging into the existing website’s user interface, user experience, and information architecture, then had a sit-down chat with the main stakeholder to get their take on how they want the website to look and feel.
The research was small-scale and face-to-face. Every research pretty much agreed on a couple of things: the website needs a pop of color beyond just neutrals, and the navigation could use some streamlining.
Taking all this into account—the research insight, the stakeholder’s thoughts, and the fact that we’re working with some tight design restrictions—a design guideline was created
The Information Architecture
The goal was to create an information architecture which would be more seamless compared to the existing one. There’s especially an encapsulation in “contents”. Previously, the “music” and “videos” links were not encapsulated into one menu link. Furthermore, the “music” and “videos” submenus have their own options within their pages. The reason for such encapsulation in the menus is to create more clarity for users.
I wanted to create an information architecture that’s way smoother than what existed before. One big thing I noticed was this odd separation in the “contents” section. The “music” and “videos” links weren’t bundled up under one neat menu link. Plus, once you dove into “music” or “videos,” there were even more options to sift through.
I changed this by bundling “music” and “videos” into one tidy menu link. Why? Well, it’s all about making things crystal clear for our users — and it did.
The Design Elements
The Impact
The stakeholder dropped some great news—they saw a boost in ticket sales! Plus, we managed to trim down the user bounce rate by single digits and bump up the user session time by double digits. I can’t disclose the full details of the metrics, but let’s just say things are looking up.
More UX Design Works
Bulan Website
Graveyard
More Work Categories
Visual Art
2 works, 3 Galleries
Visual Design
3 works