Earth Law Center Admin Page: UX Case Study
Organization Description:
Earth Law Center is legal non-profit operating worldwide that specializes in passing a new generation of earth-centric laws, such as those that establish rights of nature and the rights of future generations. In the past, ELC has worked with law makers within national and local governments and worked on enforcing eco-centric laws in courts. The organization currently comprises of 8 staff members and 30+ volunteers specializing in eco-centric laws from all over the world.
Problem Statement:
The Earth Law Center’s page is currently a static website, meaning that the interface and resources shown are the same for every user of the website. The organization has expressed the need for an admin page for staff so they can update and maintain the resources available to the users of the website. In order to make this possible, an individualized login needs to be created, where staff can add, delete, and edit the current resources available to users.
User Research and Information Architecture:
After conducting user research with our partners, the user group of the admin page, we found that the main goals of the users was to be able to edit, delete, and add new documents to the admin page without having to touch the website’s code.
Keeping these goals and insights in mind, it was important to focus a lot on accessibility to those admins who do not have a lot of experience with editing webpages, and pay attention that each task is prioritized by its importance and frequency used by the admins. One way of making the admin page easy to use was to keep it as consistent with the non-admin side of the website, since the users were already familiar with its layout on that page.
After a few partner calls with ELC’s soon-to-be admins, I started making low-fidelity, and medium fidelity sketches based on their needs and insight, and adjusted the designs based on what they said about them.
Some of the design choices included finding the best way for the admins edit and delete each card that held either a letter, resource, or a law, and deciding whether a download button was necessary in the editing version.
Other challenges included figuring out how to edit and view the content of each resource card. Some of the possible designs included directly taking the user to the Google doc that it was written in, having a screen pop up, where the admins can directly edit the resource, and more.
Since in the pop-up version the user was able to quickly switch between, I decided to keep this design for accessibility reasons. To make the pop-up screen more prevalent, I tried applying a shadow to the background, and blurring it out too to make it easier for the users to focus on the editing letter.
Besides the above mentioned design challenges, I had to rethink how to make the layout of the admin page similar enough to the non-admin side so the users would not be lost on where everything is, but not too similar that they wouldn’t be able to tell which side they are on. To solve this, I kept the pages’ layouts nearly identical to the non-admin side, only adding a few smaller button with universal labels, such as the edit label, and adding button on top of the stacks, to make it prevalent, but not overly pushy and distracting.
And solving that final challenge led to the last and final prototype: