ProZ.com

Design System/UI Design
ProZ.com wanted to refresh their site, along with a new design system that would lay the groundwork for future design decisions and ensure page consistency.
Designer
Casey Rowland
Date
2024 (1 month)
Role
Design system
UI design
Wireframing
Tools
Figma
Illustrator
Photoshop

Client needs

The decades-old site has outdated information architecture that needs a refresh, while also keeping recognizability.

Business Goals

For 25 years, ProZ has grown into a platform for freelancers across the globe to offer their language services. With over a million lines of code, the team decided to simplify its information architecture, streamline navigation, and modernize. Keeping a "human touch" despite a growing digital world was their main goal, and our new design strategy was built around this idea.

Challenge

The first major challenge was ensuring a simple and usable experience that is cohesive throughout. As there was a plethora of textual information for users to digest on each page, every section needed proper hierarchy and consistency.

Areas of focus

01. Scope

The largest challenge going into this project as a team was the scope, so we had to narrow down our focus. With that in mind, we agreed to prioritize the basic navigable pages. This enabled us to get a feel for the design direction within the month-long timeframe.

02. Modernization

As part of the re-design, it was important to explore potential styles for the new look and get feedback within the team. Collaborative ideation helped us push forward into the design phase.

Discovery

Learning the history of ProZ, as well as taking feedback from critiques about color palettes, illustration versus imagery, and font pairing led to interesting new perspectives.

The importance of collaboration

As the team wanted familiarity yet also a completely new and refreshed look, style explorations and critiques played a role in helping to narrow and establish the new design that will be rolled out for the company's website.

Wireframing

Key Pages

The scope of the project was so large, we had to choose the most important pages to show examples of implementation through wireframing.

Result

After one month of an incredibly collaborative process, I established a basic design system and guidelines for implementation.

Beyond the project

Out with the old...

Despite the short duration of this phase in the website overhaul process, we managed to create the basis of the new ProZ design system. We solidified key design aspects that can be built onto as time goes on, and aligned design with functional development.

...in with the new.

As the team continues to add onto the design system, we now have a basic design structure that will ensure cohesiveness across pages as they are being rebuilt.

Key Takeaways

We did it!

In only a month, we were able to make many key design decisions for the new version of the site. Collaboration and communication made this possible. Using the new system as inspiration, the team will turn the designs functional, sort out navigation, and add content.

What would I change or add?

To expand on implementation, there would need to be many more pages re-designed before a proper layout system is developed, simply due to the sheer size of the current website and the amount of content it possesses.

View full design guidelines PDF📚
go back home