Deejays and Vinylphiles Club

PROJECT EXPERIENCE

Deejays and Vinylphiles Club

Client / Deejays and Vinylphiles Club (DVC) at UC San Diego

Role / UI/UX Designer

Duration / 3 Months (July - September)

BACKGROUND

The Deejays and Vinylphiles Club at UCSD was established in 1997 and has been an active community for music enthusiasts interested in the DJing and dance music scene, hosting trainings, live events, and weekly meetings and socials by students for students. With the incoming school year and an expanding presence in the student eye with 1000+ Instagram followers as well as 500+ Discord members, it became increasingly important to have an official website presence that accurately and engagingly displays all the club has to offer.

Group photo of the Deejays and Vinylphiles Club after a successful event at the newly established Amphitheater at UC San Diego.

UNDERSTANDING THE PROBLEM SPACE

As the incoming DVC president as well as previous years’ Vice President and Marketing Coordinator, I experience firsthand how outdated and mundane our current website is based on my own usage as well as feedback from clients, members, and other cabinet members—and understand how vital a redesign is to appeal to new members, attendees, and clients. Especially since we market over 3-5 large-scale (501+ attendee) events per year in addition to multiple small- or medium-scale events with historic RSVP counts ranging from 300-1200, it was imperative that our website was refreshed to capitalize on this incoming traffic accordingly.

The main aspects of the sites that need to be showcased are the Events, Services, and About pages. While there are pages in place for these categories, current information is not well organized and hard to find, as shown above.

Taking on the role of UI/UX designer and developer, I was tasked with independently leading a complete redesign and implementation of DVC's official website. Upon surveying and interviewing a sample of our staff (this year at a high of 18 board members), I identified several needs.

that's me! (with some of my amazing staff team!)

DVC'S REDESIGN NEEDS

With a clear understanding of user needs, the next step was to create personas, identifying 3 key user groups with specific needs and behaviors. For each of the 3 user segments, I developed detailed persona profiles that included their demographics (age, gender, grade, major), discovery journey, psychographics such as their interests and attitudes, current pain points, goals, and tasks they would likely perform.

1

2

3

IDEATING FURTHER

The creation of personas significantly helped lay the framework for the design process so solutions could be tailored to meet the specific needs and preferences of the target users and therefore deliver the most value to them. Next, I ideated on DVC's brand identity, selecting a typography system and color palette that embodied DVC's industry and professional alignment while also combining its laidback and creative attributes.

With a detailed understanding of our target users’ needs, goals, and pain points as well as DVC's own brand identity, I began the wireframing process to translate these insights into tangible design solutions. I organized the information architecture accordingly:

Home Page:
- Focused on a more interconnected “portal”
- Generate conversions with clear calls-to-action
About Page:
- Add Meet the Team section and FAQs for visitors to get a better feel for club
Events Page:
- More clear displays of events
Services Page:
- Clear descriptions and visuals for every service offered
Contact Page:
- Form to easily reach out with any questions, feedback, or concerns

WIREFRAMES

I then expanded on the wireframes and made them clickable to simulate the navigational experience so I could conduct user testing at the lo-fi prototyping stage.

LO-FI PROTOTYPE

The user testing culminated in overall positive feedback, with unanimous approval of the updated site navigation and information architecture. The main concerns users brought up stemmed from the actual content itself that would be implemented in the future high-fidelity versions, which I made sure to focus on heavily in before my next round of testing.

A majority of my time from the low-fidelity to high-fidelity stage was thus concentrated on content gathering, media curation, and copywriting. I made sure to keep the playful, fun, and creative tone our club expresses, utilizing my witty pun-making skills I've been honing over a lifetime of hearing the worst mom- and dad- jokes at home to create masterpieces like below:

(If you know anything about DJing, this is pretty funny — or at least my staff told me it was. Maybe they were trying to spare my feelings.)

FINAL DESIGN

1. HOME PAGE

I created an informative banner with our slogan and a one-sentence summary of the club, a display of our upcoming events, engaging call-to-actions redirecting users to relevant information, and our Instagram plug-in which constantly populated itself with fresh content.

2. ABOUT PAGE

I wrote a descriptive bio, included a club picture, added the quarterly General Body Meeting Times, created links to all of the social media plugs for DVC, created a staff directory, and curated FAQs.

3. EVENTS PAGE

I added in separate sections for upcoming events, which were prominently featured at the top of the page. I then expanded the previous events section to include the comprehensive list running since the beginning of 2021-2022 to establish a baseline history.

4. SERVICES PAGE

I wrote a promotional blurb establishing our reputability and professionalism as a highly trained DJ organization, created a process graphic to assure clients of our organizational process and expected timeline, and wrote detailed information about our rates and packages complete with pictures that displayed the services in question.

MOBILE OPTIMIZATION

With the knowledge based on our personas, interviews with users, and experience as staff, I decided to optimize the site for mobile so users could access our site as a very common touch point in the user journey was scanning our QR codes on flyers and banners or learning about our club at tabling events, where they would only be using a mobile device. To ensure we were able to ensure a high-quality user experience with DVC regardless of modality, mobile accessibility was paramount and a success once launched.

REFLECTION

To our collective delight, DVC's redesign was highly successful, yielding highly positive outcomes. All staff members expressed satisfaction with the new design, appreciating its improved functionality and aesthetic. There was a notable reduction of five service clarification requests per week, indicating enhanced user understanding and ease of use that had been severely lacking prior. Additionally, site visits reached an all-time high as the year went on, yielding over 1000 monthly visitors on average and reaching a peak of 3,000 with over 10,000 site sessions—reflecting greater user engagement and interest to a substantial degree.

The UX process wasn't without obstacles, however. Firstly, a chief roadblock was finding or curating appropriate visuals and copy, as it required either gathering existing assets or dedicating time to creating new ones. This often involved extensive consultation with staff to ensure the messaging was accurate and aligned with project goals. Secondly, the project timeline was highly expedited due to the impending start of the school year, necessitating a quick turnaround. This compressed schedule demanded efficient time management and prioritization to deliver a high-quality product within the limited timeframe.

In this project, I adopted a user-centric approach, thoroughly understanding the needs and pain points of our diverse user groups through the development of representative personas. By mapping out user journeys and working to simplify or enhance these experiences, I maintained a strong focus on tangibly improving overall user satisfaction. For future iterations of this site, I would love to add sections like Notable Alumni, where we could show bios or promote members of DVC that went on to be successful in the music industry for current members to connect with, or an Online Store to potentially convert clients to pre-book or set deposits down in advance. I look forward to conducting future usability testing sessions to gather more insights for continuous iteration and refinement of the website, supporting the success of such a unique organization at UCSD.

If you're interested in checking it out, visit here: dvcucsd.com