GreenbergFarrow
GreenbergFarrow is an architecture, development, and engineering firm that works on a variety of commercial, residential, and public projects. I worked with Type/Code to redesign their portfolio site.
My Deliverables
Wireframes
Content Model
QA
Timeline
8 weeks
Problem
5 years before this project, Type/Code designed and developed the previous version of this site. Since then, GreenbergFarrow’s service offering has expanded to include a greater focus on international projects, development, and engineering services they offer in addition to architecture. The new site needs to showcase their updated strategy in addition to their architecture services.
Project Summary
I was brought onto this project after most of the discovery and planning had been completed. The majority of my time was spent wireframing. I also created a content model for the development team and completed annotations for handoff to UI designers and developers.
Kickoff + Getting Up To Speed
I was brought on after most of the discovery process had been completed. I took notes for a day of stakeholder interviews on site and helped gather sites for a competitive analysis. A sitemap was created by another designer on my team and I was given the responsibility of mocking up wireframes for each page type.
Before jumping into design, I spent time reviewing the research that had been completed. Here’s what I learned:
What are the problems with the current site?
Does not showcase the international capabilities of the firm.
Does not articulate the breadth of services the firm offers
Does not show which services are available in specific countries/regions.
Does not show the multiple 20+ year engagements the firm has completed with some clients.
User Needs
Potential Clients (primary)
See projects with a similar scope
Identify whether or not GreenbergFarrow can provide the services they require for their project.
GreenbergFarrow contact info
Potential Employees (primary)
Open positions
Office locations
Why should they want to work at GFN?
Press (secondary)
Info about a specific project
Firm history/GFN bio
How to get in contact
Enthusiasts (secondary)
Projects
Process
Sketching
I began by sketching ideas for each page type identified within the IA. I then reviewed with my UX Manager before moving forward with wireframing.
Wireframing
The wireframing process consisted of 3 sprints (1 week each). During the 3rd sprint, I annotated each screen in preparation of handoff to UI designers and developers.
Round 1 - During this round, at least 1 template was presented for each page type and we got approval for services, projects, programs, and case studies pages.
Round 2 - Between round 1 and round 2, refinements were made on the index pages for each page type that received approval in round 1. Further design iterations were completed for all additional page types with News receiving approval and most other page types requiring only small revisions.
Round 3 - After my final design presentation, all page types received approval and wireframes were handed off to UI designers. See my final wireframes below.
Content Modelling
I created a site content model for setting up the CMS that was used internally by the development team. For this project, this deliverable identified every field within the CMS that an admin would need to populate each page type with content.
QA
As development neared completion, I worked with the development team to create QA scenarios and logged bugs in JIRA.
Product Launch
Unfortunately, I don’t have access to analytics to find details on traffic or engagement, but the client was pleased with the finished product. The site launched in 2018.