Design for Life

COS has just marked their 15 year anniversary with an image rebranding. Consolidating over 1,000 blue chip clients, the objective was to bring a fresh approach that reflects its position as a leader on the market.

Play Video Preview

COS has just marked their 15 year anniversary with an image rebranding, demand for new office space is purportedly on the rise for 2013 and workspace design practices are currently undergoing innovation and change.

A design company focused on technology in the workspace should be ergonomic and intuitive, reflect a design focus and high-tech experience. The previous site was grossly outdated in terms of layout, navigation, look and feel.

The current design and layout makes differentiating key words, sales propositions and call to actions un-engaging and difficult to stand out. Site visitors do not have a clear user path throughout the content and becoming a lead for COS.

The current design and layout makes differentiating key words, sales propositions and call to actions un-engaging and difficult to stand out. Site visitors do not have a clear user path throughout the content and becoming a lead for COS.

The challenge
The client

The Team

Greg Whitfield

Creative Director and UX

Florian Langa

Senior Copywriter

Edmond Enache

Art Director

George Badea

Senior Designer

Nicu Stanila

Lead Developer

The Concept

A thorough analysis of over 9 different competitors on the Romanian market, set clear design benchmarks early on in the project. A few key take aways became clear design goals.

Competitor Analysis & Design Benchmarking

Differentiate from the “Complete Office Solutions Position”

Transforming C.O.S. into an “Aspirational” brand

Buyer Personas Conversion Goals

Psychographic target:
Simona

She is a HR director for a large multination FMCG

She has been assigned the task of identifying potential providers of office interiors

Simona is worried that the interior design project will be difficult to prove an ROI for.

Designing with a target in mind provides invaluable insights to formulating suitable User Experience propositions. Formulating these as buyer personas, helped the design team ensure that we were meeting the user experience requirements of the intended audience.

Brand Persona

Thinking of the Brand Persona, as an actual persona, sets the tone of voice for the copy, design and overall look and feel of the site. How would this person greet you? How would he ask you to sign up for the newsletter?

A Leading professional with a human approach

Key words / Attributes

  • Pragmatic
  • Reliable
  • Experienced
  • Commited
  • Design Led
  • Proactive
  • Respectful
  • Leader
  • Innovator
  • People Oriented

Digital Branding

Mood Boards

Taking the COS Brandbook as our guideline, we formulated a clear color-guide for the design team to incorporate in the design solution.

White should be used abundantly for page backgrounds, to create breathing space.

COS sky blue should be used for branding, accents, and highlighting short copy.

Muted shades of blue and navy can be used as text backgrounds, content boxes, footer and and other elements.

Focus on Visual Navigation

Use of oversized breath taking imagery, bold short messages and an intuitive navigation system (hover over boxes to change backgrounds, content and chapters – almost as natural as touching the screen!)

Inner Pages

Intuitive navigation that lets you study the projects up close, focusing on process, details and beautiful results.

Category

Hover for details

Project gallery showcase

Design

Information Architecture

Taking the COS Brandbook as our guideline, we formulated a clear color-guide for the design team to incorporate in the design solution.

A further challenge was how to structure simple and ergonomic user experience around such a vast amount of information E.g. For a user to find a product the navigation path might look like: Products Page > Product Category > Product Subcategory > Product filters (by type, brand) > Product.

Wireframes

A powerful tool to help envision user interaction with complex navigation paths. Wireframes help avoid costly changes at the Development Stage.

Homepage structure
Products page structure
Maintaining layout organized in a grid
Fluid layout to adapt to any device

Final Product

    1. Browser away
    2. Homepage
    3. Products
    4. Services
    5. Resources

    The key element is not to just design and develop, but ultimately offer an interactive experience.

    The simple navigation accomodates a very large set of services and products from COS

    No breadcrumbs, but clear elements that place the information upfront, ofering a delightful user experience.

    Intelligent - Intuitive - Adaptable

    A special project needs to be available to the user anywhere, anytime. That’s why we crafted a concept that continuously adapts to any device.

    Facebook Twitter Linkedin Google

    Spread the Love!