KELLER WILLIAMS

Creative Director / Product Designer

the
PROJECT

The Warmack Group’s technological prowess has made them the state's most successful Keller Williams brokerage. Always an innovator in the industry, they distinguished themselves in the Seattle housing boom. To stay on top of the competitive landscape, they needed top agents and pertinent industry data on demand. True to their commitment, The Warmack Group tapped us to make analytics approachable and data customizable to anyone in the brokerage. They also wanted a mobile app to readily source desirable talent in the real estate industry.

Research & Discovery

Brand Development

Product Development

Interaction Design

Visual Design

Communications

my
ROLE

I partnered with two project managers, ours and Keller Williams', to streamline content  and translate concepts into features that addressed the client's brokerage specific needs. 
I directly managed an internal creative team of an interaction
designer, a visual designer, and a production artist. 

Responsibilities: Creative direction for live product support and user experience, interface design, visual design, wireframing, prototyping and people management.

Adobe XD CC 
Adobe Photoshop CC

Adobe Illustrator CC

Microsoft Office 365

Microsoft Power BI

Zeplin

color
PALETTE
Primary
brand colors
Neutral
brand colors
Secondary
brand colors

HEX # B40101

RGB 180/1/1

HEX # 04BCA8

RGB 4/188/168

HEX # 062230

RGB 6/34/48

HEX # 1A94D6

RGB 26/148/214

HEX # FFFFFF

RGB 255/255/255

HEX # EAEAEA

RGB 234/234/234

HEX # CCCCCC

RGB 204/204/204

HEX # 0B893E

RGB 11/137/62

HEX # FF9F08
RGB 255/159/8

HEX # B40101

RGB 180/1/1

HEX # 767676

RGB 118/118/118

HEX # 505050

RGB 80/80/80

brand
TYPOGRAPHY
Aa
Helvetica Neue LT Standard LIGHT
Aa
Helvetica Neue LT Standard HEAVY
Aa
Helvetica Neue LT Standard THIN
SECTION TITLE 
42pt
SUBHEADER
36pt
BUTTON TITLE
Text Field
Paragraph Title
Body Copy
24pt
24pt
24pt
18pt
custom
ICONS

I crafted a custom set of icons for the Keller Williams application in the style of the ones used within the Warmack Group website. Not only did they ensure brand consistency, but they helped identify key features and carry the story across the new app.

application
ICONOGRAPHY
brand
INPUTS
ux
DESIGN

The requirements for The Warmack Group's "GO Hire" mobile app were pretty straightforward, however due to the complexity of the back-end and data displayed, it helps to establish the app's foundation and structure before moving on to applying the brand. That's why we developed high-fidelity wireframes to determine the complete story. Once approved, moving ahead with the visual design was easy.

app
MAP
KW-TWG_welcome
Microsoft Power BI
real-estate metrics
dashboard link
KW_dashboard
KW-TWG_home
Warmack brokerage - default page
KW-TWG_home
PNW market overview
KW-TWG_agent_search
Agent search and filtering page
KW-TWG_agent_sort
Agent sorting page
KW-TWG_agent_detail
1/6
metrics
DASHBOARD

Sifting through Excel sheets, SQL queries, mobile apps, databases and sales reports requires a ton of work that takes brokerage owners and recruiters away from netting the talent. Enter Microsoft Power BI (Business Intelligence) - a powerful analytics tool that sources, correlates, and displays data from various sources into neat, customizable dashboards for non-techies to digest. We developed a comprehensive dashboard (branded to The Warmack Group) to analyze the data; the simple visual interface instantly grants the user access through nothing but a few clicks.

Select the button below (the one that reads "Power BI", in the big, off-brand yellow bar) to see the Keller Williams metrics dashboard design in action!

1/2
  • Black LinkedIn Icon
  • Black Facebook Icon
  • Black Twitter Icon
  • Black Instagram Icon

+1 (206) 972-7483

|

© Thomas Troisch