Group Against Smog & Pollution Website
Context:
The Group Against Smog and Pollution works to improve air quality to protect human, environmental, and economic health in Southwestern Pennsylvania. GASP had reoccurring usability issues from the admin side with not being able to correctly update their site, and the design wasn't up-to-date. They wanted a brand new site that had all the information of the old one, was visually pleasing, and user-friendly.
Challenge:
The challenge was moving all the necessary information, and creating new avenues for user engagement, while also rebranding with a new logo. The admin users needed to be able to easily update the website, and have it be more manageable on a daily basis.
Solution:
Center the rebranding around the new logo, and move the website from Wordpress over to WIX to increase usability for anyone in organization. The information from the old site was organized, and put into better categories that were easily navigable, so any user could easily find the information they needed.
Scope: Non-profit, Contractor
Duration: Three months
Tools: Figma and WIX
Role: Concept, Wireframe, Development
User Research
I researched other non-profits that focused on environmental justice and was able to gain insight on what worked well and what didn't, and how I could design the site to best boost user engagement. GASP needed a website that would increase engagement, be easily updatable, and visually modernize the design. The target audience is a wide range of users, however it is mostly people of all ages that want to be involved with climate action, and need the information that GASP provides.
Pain Points
GASP admin had no way of updating their layout of design format, and needed to make it more usable.
There was incomplete information spread across the site and it needed to be better organized so that users could find what they need more easily.
Their new logo needed a new design to fit, and the website did not match the branding they were going for.
Design Process
Sitemap
The entire site needed to be re-organized to include more information, and easier navigation. The process of creating these sitemaps came together through meetings with the communications director and the president of GASP. It was up to me to decide first concepts and where to take the direction of the navigation. The sitemap went through multiple versions before coming to this final version.
Wireframe
The wireframe was created taking in mind a few of the pages, and information that GASP wanted easily findable. Building from their old website I took a new approach and tried to better categorize the information they had on their site.
Development
The new site was developed using WIX, and I created the website from concept through development.
Takeaways
Throughout this project, I learned to:
-
Be creative and anticipate user needs.
-
Keep navigation simple.
-
Provide opportunities for users to get more involved.
After finishing this design there are a few design elements I would change or improve:
-
I would have fleshed out prototypes more so the development would have been more determined.
-
I would make the layout more dynamic by including different visual aspects.