Houston Design: Greater Houston Partnership Website

As part of our ongoing look at the work being done within the Houston design community, AIGA Houston is showcasing the recent update to the website for the Greater Houston Partnership.

The Greater Houston Partnership (GHP) is a gathering place for community-minded business leaders who want to be involved in Houston’s positive growth and influence our economic trajectory. To learn more about their new website, we spoke with Marley Holt, UI/UX designer at Poetic Systems

The new homepage for https://www.houston.org/

What prompted the update to the design?

Houston.org has a diverse audience ranging from their internal teams,  members, economic researchers, and site selectors just to name a few. The previous design didn’t adequately cater to their multiple user-types, which made the information relevant to the user difficult to find.

How did the website strategy influence the design?

Our team produced a 76-page strategy report that documented the client’s business goals, competitor analyses, user personas, interviews, our recommendations, and a new site map. The need to promote appealing Houston statistics, membership, and events were really important. We made sure these items are sprinkled throughout the design.

Can you briefly describe the website design process?

We used a spreadsheet to list all 80-plus webpages and mark them as high- or low-risk. I would reference the site map in our strategy report to note the information, goals, and user personas defined for each page. I started with wireframes to review with the client to ensure I was prioritizing information correctly and wasn’t missing any content. After wireframe approval, I would design a high-fidelity mockup for high-risk pages. Low-risk pages remained as wireframes. It was pretty fast-paced—sometimes I was meeting with the client three times a week for reviews and approvals. Having a strategy report was vital during the design process because it kept everyone on the same page and significantly reduced design changes or iterations.

A sample interior page layout.

What application(s) did you use to develop the new site design?

I used Sketch. Sketch’s symbols, text styles, and libraries were so handy for keeping such a massive project organized! I also used the Plant plugin for version control.

What were some of the considerations you had for the UX and UI of the site?

While we love to say “the fold” doesn’t exist, I will say it certainly played a role in the design of event pages. In my first mockup, which ignored the fold, 60% of page visitors viewed key event information. After a few tweaks and moving information higher, not only did that improve to 98%, but users actually scrolled further after I moved content “above the fold.”

What platform(CMS) did you use to build the GHP site? Did it influence the website?

Houston.org is built on Drupal. We ran a bit of an experiment with development for this project by having a couple of our designers build a CSS-based design system in Webflow before hand-off to our international development team. We’ve learned that support/maintenance items post-launch has benefited the most from this experiment.

A sample interior page layout.

Did the website design influence any other brand applications for GHP?

Not yet! GHP has a membership portal that was redesigned too, but that ran parallel with the website redesign.

Were there any unexpected issues during the process you had to resolve? If so, can you tell us what the problem was and the solution you found?

This project moved fairly smoothly. However, a personal challenge I had was having to fully design one page at a time. When I design websites, I prefer to work simultaneously on a few pages so I can see how components work across pages and in different contexts. There were times I updated components on previously approved pages and had to justify why. I was a new hire at the time so that was a little intimidating!  

Thanks so much to Marley for sharing her experience with the AIGA Houston community. You can learn more about her online:

Marley Holt, UI/UX Designer, Poetic Systems
marleyholt.com
dribbble.com/maaholt

By aigahouston
Published January 30, 2020
Comments
AIGA encourages thoughtful, responsible discourse. Please add comments judiciously, and refrain from maligning any individual, institution or body of work. Read our policy on commenting.