With the experience of designing 100 + products, we thought it would be pretty easy for us to rebrand and redesign ourselves. But boy, were we wrong? For a seasoned team of fine designers, with several awards up our sleeves; it was honestly quite challenging but super fun. I think we as ‘experience designers’ are super critical of what we do and we are the harshest to ourselves, don’t you agree? However, here’s a disclaimer, no we have not redesigned a 3D interactive or an absolutely stunning out of the box website, not because we are not capable, but because the journey, needs, and preferences of our target audience has been prioritized. In our case, the primary audience is our clients.
Why Rebranding?
When we started Onething in 2015, it was purely for the love of design. It’s been 5 years and a lot has changed and evolved since then. Our vision evolved, and our love for design kept growing.
We have always believed that design can make this world a much better place to live. Our new brand aspires to communicate vividly with every person and let them feel the power of digital design. The designs are simple yet communicative, they are bold yet humble, they are futuristic yet emotive.
What's Onething?
We are fun, energetic, bold, and outspoken designers who drive growth and transformation through design. We can relate ourselves really well with geometry because there is science and emotions that it portrays through visual representation. And hence, you will find the new branding based on the basic geometric shapes, geometric typeface and specific colours to represent each of the Onething’s very specific attributes.
These are the principles we live by -
- Think, and then do.
- Truth, always.
- Respect.
- Shoot to win.
- Be there for each other.
- Take ownership, every time.
Logo Design
We wanted our logo to express Onething in its natural habitat. After hundreds of iterations, we closed on 3 basic geometric shapes which meaningfully constitutes Onething's logo.
The Circle - Representing Energy, Dynamism, and Unity
The Arc - Representing Balance, Growth, and Action
And, the square - Representing the four pillars - people (emotions), technology, business, and design
And finally, the Logo
The right mixture of all these attributes expressed by the 3 elements is what we were looking for to be our logo. We’ve played along with the three elements and designed a minimal logo that comes together to shape it as numerical 1
The Typography
We explored a lot of geometric typefaces. Compared each and every letter of those but when we came across this perfectly geometric, objective, neutral and clean type named “objectivity”, we didn’t need to look any further. 8 weights, 16 styles, 347 glyphs per font and supports 192 languages; what more can you ask for.
The x-height, character width, stroke contrast, and the counters of objectivity are comparatively better optimised for legibility.
Spectacular job done by this amazing type designer Alex Slobzheninov -
The Colour Palette
We still believe that there’s no greater colour than the black and white; But we decided to add colours that accentuate our quirky, bold, and tongue in cheek humour avatar. Our primary colours are the fiery Red and the panther Black
Fiery Red is for passion, energy, life, and love. It complements well with black and white and helps draw attention.
Panther Black is for power, strength, seriousness, and elegance.
Secondary colour palette Coolest Blue | Bright Green | Happy Yellow
The Iconography
Designed to be bold and meaningful, our iconography has to be primarily in 'Panther Black' with the most important part highlighted in 'Fiery Red'. And, just to add some extra visual appeal, each icon must have another representation of the same icon in light grey in the background.
The Elements
This is something one doesn't generally see as a part of branding. For a design agency like ours, there are situations when you need fillers in your design and to maintain consistency we defined it as part of our branding.
This pattern is designed using the 3 basic elements of our brand and parts of it will be used throughout our collaterals.
The Illustrations
We have divided the type of illustrations into two.
- Full-width hero illustrations - Used mainly for the purpose to add visual delight
- With text illustrations - Used to explain a very specific subject and are always associated with text
The only rule we have for 'full-width hero illustrations' is that these should reflect fun and quirk. It should feel like it's a paused video which if played, things will start moving rapidly.
For the 'with text illustrations', the idea is to make them as to the point as possible maintaining the delightful experience. A user should ideally be able to understand the context even without reading the text associated with it.
Here are a few examples of illustrations for Onething -
The Layout
Our grid system is a mix of 'Column' and 'Modular'.
- Column Grid - We have taken a fluid approach here. The content will cover the whole width of the screen, dividing the viewport width into 12 equal columns with dynamic gutter space.
- Modular Grid - Some layouts asked for the column and row width to be relative. That's where Modular Grid comes in. 12 Columns and 8 rows, where column width and row height are both a function of the viewport width.