Sutin, Thayer & Browne - Website Redesign
SUTIN, THAYER & BROWNE

Sutin, Thayer & Browne is a world-class law firm in business for over 70 years in the heart of New Mexico!

I led the redesign of sutinfirm.com to make it easier for their clients to find and contact Sutin’s lawyers especially on mobile devices. They also wanted the design to better reflect their sophisticated, southwest brand and high-end clientele. In addition to design work, I migrated their content and implemented sutinfirm.com to a modern ExpressionEngine CMS setup that empowers staff to take control of their own site and marketing.

Agency
Bright Umbrella
Lealea Design

Responsibilities
Research and Discovery
User Experience
Visual UI Design
Art Direction
ExpressionEngine CMS development
Speed Optimization

Team
Project Management, 
Research and Discovery, 
Front-end Development 
— Emily Lewis
Responsive Website Screens
Sophisticated Southwest Style
PROJECT NEEDS

Sutin needed a website that radiated sophistication in appearance and content, establishing expectations of high quality and high performance. There was heavy emphasis in establishing a style that reflected these brand promises while standing out against a sea of competitors using templated sites.

Equally important to fulfill these goals was to create a mobile-friendly site that was easier for users to navigate to lead to the right lawyer for the job. Their previous site iterations were dated and wasted staff time to update since it required frequent requests to IT.
Multiple Areas of Navigation
In-browser Wireframes and Style Tiles
Our firm wanted a website that reflects the level of skill and sophistication our clients expect and receive from our lawyers. I knew we had liftoff when the firm’s lawyers on the project said they loved [Lea]'s design.

KELLY BREWER, DIRECTOR OF MARKETING & COMMUNICATIONS
SUTIN, THAYER & BROWNE
In-browser Style Tile that showcases Premium and Budget Design Options
The final product is in a browser, so the faster we could get prototypes in the final state it could be in, the better! Emily Lewis created LiveWires in-browser for client-facing initial wireframes. I worked on an in-browser Style Tile and Element Collage to convey early-stage design direction.

Because of all these early-stage prototypes, we were able to get this in front of the lawyers for a round of user testing and feedback — reviewing layouts for various screens, content priorities, and interaction. For the style tile, they were able to see what specific elements actually look like, playing with hovers and gauging a real idea of proportion and scale.
Addressing Volume of Static Comps
This project led us to consider design efficiencies. The above screens are just a snippet of the original static comps I designed and created. However, the time and effort involved creating all these screens were more than necessary, especially since the final product is meant to be an interactive website, not static images.

I attempted to answer these questions (and more!) at ConvergeSE in Columbia, SC
I created Beyond Static: Design Deliverables as a design accompaniment to Emily’s more development-focused talk regarding Bright Umbrella’s internal framework (dubbed Starter Files). My presentation was a show-and-tell of actual client examples of what I did at Bright Umbrella.

KEY TAKEAWAYS

Static deliverables still have a place for internal and client discussions. Use what helps convey your ideas most effectively.

New design deliverables = new client expectations. Communicate early and often with your clients so you can understand their needs and set expectations. Only then should you decide what deliverables remain static and what can be dynamic.

Get a project prototype into the final environment as soon as possible (in the case above, it was through LiveWires)

Think about what you can do at the start of the project and how it can inform the end — design systems, not pages.

Time is money.
Sutin, Thayer & Browne - Website Redesign
0
11
0
Published:

Sutin, Thayer & Browne - Website Redesign

I led the redesign of sutinfirm.com to make it easier for their clients to find and contact Sutin’s lawyers, especially on mobile devices. They a Read More
0
11
0
Published:

Tools

Adobe Photoshop
Adobe Illustrator

Creative Fields

Copyright Info

No use is allowed without explicit permission from owner