CMS Dashboard

This project is about designing a dashboard for a CMS system created by our agency. The focus is on user-centered design, making it easier for users to maintain their websites and do more than just fill in their content.

The assesment

I was asked to understand what users need to design a dashboard for a CMS system built by the agency. This dashboard should not only help users fill in content but also optimize their websites. Communication is important for the agency, and it currently happens through different channels. Both users and the agency want a clear view of their communication. For this project, I chose to use the Double Diamond method to find out what users really needed.

My goal: to design a dashboard for the CMS system that gives customers a better experience when managing their websites. Additionally, I aim to increase customer engagement by improving communication with customers.

Research

Research was done by conducting a survey and interviewing current clients who are using the CMS system. The survey answers gave me insights into the first struggles of the users, which I then explored further in the interviews. For example, most users are generally happy about being able to fill the content of their website, but they aren't as happy about the insights on SEO and SEA. At the moment, this information can't be viewed on the dashboard or CMS system at all. From the interviews, it seems that users don't only want to fill their website in an easier way; they also want to see how their website is performing so they can improve it.

Current dashboard

Concepting

After the research was done, I first defined all the research results I had gathered. I created empathy maps to understand the users better. I also created a customer journey to understand the agency's service more and to see where it could improve. Then, I set up user needs to prioritize which needs were most important. The biggest insight was that there is a big difference between users who have marketing privileges at the agency and those who do not. They want to see different things based on SEO and SEA to improve their websites.

Based on the user needs, I started to think of functionalities that could fit their needs. This led me to a lot of post-its with functionalities, from small to big ones, which I then sorted into groups to create overarching functionalities. This process ended up in a final concept with functionalities available for every user and special functionalities for users with or without marketing privileges.

For example, users with marketing privileges get to see detailed data on how their website is doing, like the number of visitors and clicks. Users without marketing privileges will see a percentage of how their website is performing and get tips on how to improve it.

Validating concept

I validated my concept in two ways. First, I conducted another interview with a client who had recently started using the CMS system. This was valuable because she had several frustrations with the system. I asked her about the functionalities I had in mind to understand if they would improve her usability. I also discussed with her how she would prefer to see these functionalities presented, whether as statistics or simple information.

After the interview, I reviewed and refined my empathy maps and user needs to gain a clearer understanding. This process helped me finalize my concept.

Following this, I created initial sketches of the concept to share with stakeholders and gather feedback, particularly regarding UX and agency requirements. During this process, stakeholders preferred to address one functionality internally rather than integrate it into the dashboard. Additionally, I encountered a new challenge: ensuring the concept is responsive across various devices, including laptops and large computer screens.

Final concept

The final concept is called "Your Dashboard, Your Rules." It features a customizable dashboard where users can select which functionalities to add. Various options will be available depending on whether the user is just starting to build their website or already live and whether they have marketing privileges or not. This approach allows every user to personalize their dashboard with the tools they find most useful for improving their website.

Wireframes

Before starting on wireframes, I created some quick sketches to tackle the challenges of responsiveness and allowing users to customize their dashboard. Through this process, I discovered that if I design larger blocks that fill the entire screen and smaller boxes that always occupy 33% of the remaining space, I can avoid constant resizing issues. However, this approach limits users' freedom to place certain functionalities at the top of the dashboard; now, they are required to have status and scores always at the top. Based on research, though, these were identified as the most important functionalities for most users, so it shouldn't pose a significant problem.

After resolving these issues, I developed the initial wireframes. These wireframes were then reviewed by two UX experts to optimize them before moving forward to the next stage of development.

Visual design

After finalizing the wireframes, I first created a style tile to ensure consistent branding and make it easier for others to continue the project with the correct colors and typography. Following that, I transformed the wireframes into a visual design which I tested with clients currently using the CMS system. I employed scenario-based user testing, asking users to think aloud as they interacted with the design.

Through this method, I discovered that when users made edits to their dashboard, it wasn't always clear to everyone that changes had been made. To address this, I incorporated a loading bar. I iterated on the design based on feedback and testing results, eventually arriving at a final design.

Conclusion

Looking at the results from the tests, it's clear that the usability, communication, and overall connection have improved based on feedback from users before and after implementing the changes. Initially, users found the system less user-friendly, but this has since improved noticeably. Communication has also been rated more positively. Overall, there has been a noticeable strengthening of the connection with the users. These findings highlight the positive impact of the new dashboard on usability, communication effectiveness, and overall user satisfaction.

Reflection

Reflecting on the project, I conducted design reviews and stakeholder reviews, but in hindsight, I realize I could have fostered more collaboration and utilized a co-creation session. Integrating co-creation during the concept development phase would have allowed me to leverage everyone's strengths and incorporate the stakeholders' preferences more effectively. This approach could have resulted in a dashboard that not only met but exceeded both user and stakeholder expectations.