Designing for happiness

hiMoment — Your digital happiness guru

I joined hiMoment in January 2017 as Chief Experience Officer & co-founder. Just like with any other startup, we had to very quickly establish a visual style—logo, visual style, templates, you know the classics—and start iterating on the product experience. There’s never enough time, is there?

This case study covers some stuff in the first year of hiMoment:

So, why happiness? Who are we? What do we do? Good questions. We’re figuring out the answers as we go. It’s a messy, ongoing process…

It goes a bit like this:

We know we want to help people be happier. No, we can’t use the word help, that sounds like therapy. We want to make it easier for people to get happier. Cool, let’s see how long we stick with this one.

We know we’re building a tool that helps you become your own personal life coach. Oh wait, scrap that, our users prefer to have someone who motivates them, like in a gym. Great, now we have to rewrite our whole manifesto (we never finished a manifesto).

Here’s what we settled down for. We need a short description if someone asks. We need a longer description if someone wants to write about us. We can use the short one for social media. We need a pitch covering all of the important keywords and buzzwords.

The rest? We’ll figure it out when we need it.

Alright, we need a logo, the world is not ready for a logo-less startup just yet. We need something that feels safe and welcoming. Hmmm, what’s the ultimate proof of trust? A signature! Let’s create a handwritten logotype. Genius.

Let’s see if there are any nice fonts we can tweak into our company signature. Oh, no money for fonts? Free fonts it is. There are no decent ones? Oh, well…

Turns out custom hand lettering is A LOT of drawing the same curve over and over again. And then again when you look at it 30 minutes later. But it’s doable.

Plenty of the shapes repeat—an “h” is just an “n” with a longer ascender, and so on.

Oh yeah, and only horizontal and vertical bezier handles only. For the sake of Ordnung.

Choosing the brand colour palette was a very quick process. In almost every culture yellow represents sunshine, happiness, and warmth. Done. Added a little gradient from darker to brighter yellow for extra bling.

The decision to drive all of the communications through hiMo the mascot was done somewhere in May. Simplicity is the key here, we need to be able to quickly produce a wide variety of messages/emotions/states-of-mind with a minimum amount of effort.

Let’s think for a while. The current ultimate visual language for emotions is emoji. Emoji are yellow by default. hiMoment’s brand colour is yellow. It’s a match made in heaven.

Drawing inspiration from the classic emoji characters, we’ve added some wise-yet-funky elements (e.g. the white beard with some beard jewellery) and a character was born.

Remember the need for quick generation of different versions? We’ve iterated the head/beard shapes along the x axis and emotions/expressions along the y axis. Then, all are brought on top of one another in one file so they can be programmatically turned on and off in the output SVG file—crucial for our implementation.

Users need to discover how we can make their lives easier and can quickly continue to download the app. And yet, the site needs to be memorable, hmmm…

Wait, what if we show all the information as messages from hiMo? That would feel natural, friendly, and would establish hiMo’s role as a guru already on the website!

Quickly put together a Wordpress theme with the building blocks (to allow the non-tech team members to make edits), and we’re ready for testing. And by testing I mean live testing on production based on the Analytics data.

Also, we need to be able to track the clicks outside of the website – to the app stores – but that simple with custom page views.

hiMo encourages you to do three things:

Cool, now we just have to explain to the users how the whole magic works. We’ve built an extensive onboarding process, explaining the psychological concepts in series of challenges, showing the usage mechanisms through those.

The app is build as a React application run inside a native Cordova wrapper to get access to native features – such as push notifications. React Native will come when we set on what we want to do.

Being a co-founder responsible for the product means constant juggling of the managerial and executive tasks. Being in charge of the product from the UX, through UI, all the way to development means constant juggling of different tools to solve the problems. Juggling is hard.

You rarely get it right the first time. Being open to testing and iterating on ideas and solutions is the most important thing to keeping your own sanity.

Wanna read some more? Don’t worry, I’ve got you covered — more case studies (and some other cool stuff) on my website:

Related posts:

If you work in local democratic politics and were surprised by Steve Stenger’s indictment and subsequent guilty plea for a pay-to-play scheme you are either a) lying or b) lying. While some folks…

Cryptocurrencies have created their value in the financial world despite so many condemnations. There are Fiat currency, Gold, and cryptocurrency which are around us, and we all have heard at least…