GP Advertising

For this website update, I knew that the people and culture of GP is what made them unique, so my goal was to showcase that. GP Advertising is an in-house agency servicing Harvey Norman, Domayne and Joyce Mayne’s digital and print advertising efforts. Their problem was that the current website looked outdated. It gave potential hires the impression that the company was frozen-in-time and unable to provide them with up to date skills. But it also had archived work and (not very discoverable) team leader profiles that shone with character. As part of their digital team, I was tasked with concepting an update.

SCOPE Web, UX/UI TEAM Digital; GP Advertising

Research notes and feedback from wireframe meetings

INSIGHT Since GP is an in-house agency and doesn’t need to attract new clients (something that's different to a typical client-focused agency), the websites purpose would be for first impressions for prospective employees.

Desktop and mobile Figma wireframes for the Home, Work, a project and About pages, respectively

DESIGN DECISIONS Showcasing GP's personality A home page video above the fold focuses on the people behind GP before their work. The first home page CTA encourages users to get to know more about GP, directing them to the 'About Us' page. That 'About Us' page would feature staff photos, archived work and personality-filled profiles for each team leader. For potential employees Headlines across each page define who GP is. In the nav bar, a 'Careers' external link helps users get back to their job listing easily. After reaching the end of a project, users can continue to flow through the website easily with a 'Back to our work' button, or choose from 'Related work'.

CUT SHORT With these wireframes, the proposed redesign was presented to internal stakeholders and well received, though unfortunately my tenure finished before the website could be developed and shipped.

Home, a project and About page on mobile

OUTCOME But with a desire to answer “what would it have ended up looking like?” I decided to finish what I started, building high fidelity wireframes with some interaction mockups. And with a fresh pair of eyes, I also took the CMYK-inspired highlights of the existing website and injected them throughout, alongside revising the home page so the headline wasn’t cut off by the fold of some devices.

Design system

Our Work page

A project page

About Us page (with a staff photo from 2010!)

LEARNINGS Using a scaled set of spacing measurements is a massive time saver for layout decisions. I jumped too quickly into wireframing. Only after I started it did I come to fully understand the websites purpose and GP’s unique personality. With that understanding, design decisions then had a clear purpose and goal. Next time I know to undertake a proper research phase.
Looking at the mobile wireframe on desktop doesnt compare to viewing it on a physical phone. I found I like checking the layout on a phone as it offers a fresh perspective for possible adjustments.