CM
I worked on designing a new website for Josh Wink to improve the user experience for his fans. I had an amazing experience working on this over the last half of 2021.
The goal was to design the site and then build a responsive website on Webflow. The project consisted of researching, designing, and prototyping to properly create his site.
For 25 years, DJ and electronic artist Josh Wink has been at the forefront of American electronic music, specifically the House and Techno scene. He is legendary within the Acid House music community and American rave culture. DJ Josh Wink is best known for his hit song, Higher State of Consciousness.
Josh Wink needed a new website that was both modern and responsive. Josh approached me to remix his current website and provide a new one for 2022 that stood out from the rest of the electronic music websites.
For this project, I had to continuously communicate with my clients, Josh Wink and his manager Matt Brookman, to update them on my progress as well as be proactive in seeking out feedback.
How would a Josh Wink music fan interact with his website? What would they want to see and do? How could we compel his fans to visit?
The prior Josh Wink website was outdated and lacked clear calls to actions. I created a fresh redesign and then built the new website with Webflow. In short, I researched both the previous website and DJ competitors, and identified what a Josh Wink fan wanted to see on a website. Understanding the pain points allowed me to properly focus on the correct information architecture and website functionality, ultimately creating a brand new tour dates section, and hero section with updated photography. This would help fans explore faster and more accurately on his site.
.png)
.png)
As someone who spent 10 years as an electronic music DJ, specializing in House and Techno music, I understood the aesthetic of an electronic artist.
My first step was to understand the constraints of the current website and identify where we can improve the UX. I researched best in-class examples by doing a competitive audit on three contemporary House and Techno DJs. I conducted user interviews with former colleagues and listened to their ideas of what would be ideal on a “DJ website”..
Through this information I was able to identify pain-points, and see where we could improve upon them. I decided it was crucial to highlight three things: social media, touring, and a booking button.
I also wanted to see what specific artists were doing on their websites. I enjoyed the simplicity of both the Matthias Tanzmann and Nicole Moudaber websites.
My audit goal was to find out what direct & indirect competition were doing correctly, and what we can improve regarding website functionality, UI and UX.
After analyzing the user responses, I identified his fans as typically over the age of 30, with interests in underground house and techno music, and a respect for the genre of Acid House. Research also revealed that a section on label history would be ideal.
I created one user persona to best represent this collection of responses: Paul, a 37 year old software engineer who enjoys Techno and Acid House. He likes to go out and dance to his favorite DJ’s such as Josh Wink, Carl Cox, and Special Request.
By focusing on a simple and effective layout, with clean information architecture, which solves the problem identified earlier, Josh Wink’s new website will be functional and visually pleasing. With the user research in hand, I created a structure that served as a roadmap for the low fidelity stage. Taking the time to draft iterations was critical to cementing the proper feel of his new website.
As the initial design phase continued, I ensured only the essential elements addressing pain points made it to the digital wireframes- this was based on our research and client feedback.
On the hero I prioritized the social icons, and per Josh’s request, added a hamburger menu for the rest of his website sections. By making the hero section a large and extreme cropped image of Josh Wink, it added visual weight to his new website.
After the wireframes were complete, I sat down with the client and listened to their feedback to create the high fidelity designs of the website user interface.
I worked inside Adobe XD and Figma, and made a simple sticker sheet with some reusable components.
Color and type choices were meant to feel like Techno music: Black and white, and hints of yellow. Since Josh Wink is known for his Acid House music with tracks such as “Higher State of Consciousness”, I took the eye dropper tool and sampled a specific yellow from the famous “Acid smiley face.”
Once the client signed off on the mockups, I went to build the website on Webflow.
As someone who is color blind, and has accessibility issues with certain color shades, I know the importance of focusing on website accessibility. I made sure to add all Alt-text to images and follow the Webflow contrast checker and guidelines, to make sure everything was easily readable.
How did I improve the users experience with the new design?
The older website maintained an outdated look and feel, as well as being ambiguous on what the user was actually supposed to be doing. We fixed both the UI and UX on his new website.
This project allowed me to practice critical thinking, attention to detail, and human-centered design thinking to consider all the useful features I could add to such a simple website. These features give flexibility to the end-user.
Ultimately, I sought opportunities to experiment with novel interactions and in the end, I was able to deliver a website to my client that looks clean and is intuitive.
During this project, I discovered opportunities to work on my soft skills such as communication, and my tool skills by diving deeper into both Figma and Webflow.
As a freelancer I need to make sure the client is happy. Since the client was very satisfied with the result, I likely wouldn't change much on the project execution moving forward.
However, in terms of project management and deadlines, I didn’t really stick to a set schedule nor communicate to the client my need to stay on a timeline. The schedule would’ve held myself accountable. It can be easy to neglect this important piece of productivity, that should otherwise be obvious, so I'll be more mindful of this moving forward on all web and mobile projects.
AND MAKE SOMETHING BIG
