Case Study 2 〜DPARK's Web Site Design〜

Project duration: April 2022 to June 2022

The product :

DPARK is a social networking service that provide an online community in which digital marketers can engage each other. The typical user is between 20-40years old, and most users work for digital marketing companies. DPARK’s goal is to enhance ties among digital marketers who lead its industry.

The problem :

There are so many networking services in the world, but there is nothing to focus only on digital marketers who are involved in one of the hottest industries.

The goal :

Design DPARK’s website to be user friendly by providing a space for communication and collaboration to enhance their network and knowledge.

The role :

UX designer designing a responsive website for DPARK from conception to delivery.

The responsibilities :

Conducting interviews, paper and digital wire-framing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs and responsive design.

User Research

Summary :

I conducted user interviews, which I then turned into empathy maps to better understand the target user and their needs. I discovered that many target users communicate each other via many social networking services, but there is no all-in-one service and nothing to focus only digital marketers.
Therefore, our target users want to be in touch via texts, movies, and video chats while posting and sharing a trend in the industry to keep up with fast-moving trends of the digital marketing world.

Persona 1 :
Ken

User journey map :

Starting the design

Sitemap :

Paper wireframes :

Low-fidelity prototype :

View the link of :

Low-fidelity prototype

Usability study findings :

Page transition

Usability study revealed that users accept page transition on mobile devices

Function on messages

Users prefer to take actions, such as share or save, when they write a comment on posts

Reaction by icon

Users prefer to add their reactions by icons when they read a message

Refining the design

Mockups for smartphone:

Before usability study

After usability study

Mockups for Desktop :

High-fidelity prototype :

View the link of :

High-fidelity prototype

Accessibility considerations :

I used headings with different sized text for clear visual hierarchy

I used icons to help users navigate the site, including users who rely on assistive technologies

I used clear contrast, which meets WCAG 2.0, so users can recognize each contents clearly

Takeaways

Impact :

Our target users gave us positive feedback on our prototype regarding clear transition and enough functions for each content.

What I learned :

I learned that we need to keep up with trends of fast-moving social networking service. Some new features came up after I started this project. Staying start-of-the-art would be a key for success in this service category.

Next steps

Conduct follow-up usability testing on the new website

Identify any additional areas of need and ideate on new features