Everlytic is a startup HQ’d in South Africa that let’s you create and send beautiful and effective email campaigns.

 

Through a unified messaging platform that ties into social and mobile messaging with rich analytics, Everlytic enables users to improve their ROI with highly targeted messages, advanced segmentation and a 360 view of their target audience.

The rich email campaign analytics is what sets Everlytic apart from its competitors, and as my first project with the company, I was tasked with re-designing the way the analytical reporting interfaces worked and looked.

 

Up until that point, the interfaces were glued together by the team of developers and needed a more aesthetic touch.

I first conducted interviews with the many stakeholders involved in this project. I interviewed the CEO, Sales Team, Support Team and some of the Developers who initially worked on the feature.

 

From them I learned the importance of each of the metrics listed in the old interface, the initial problems that users dealt with and needed support on the most, and that this interface would be a strong selling point for the sales team if done correctly.

 

I then decided to learn from the users of this feature and went about some testing.

 

I used a service called SessionCam to do remote screen recordings and documented about 400 unique sessions of users using the entire Everlytic application.

 

This immediately opened my eyes to the stumbling blocks users faced, one of which was that users struggled to find not only the correct metrics they were looking for, but also more detailed reporting on specific things, like user activity, or link performance.

 

After that I performed a Heuristic Review based on universally recognized heuristics and focused on Functionality, Starting Points, Navigation, Search, Control, Feedback, Forms, Error States, Content, Performance & Help.

 

This showed me the overall lack of usability in the product and where easy gains could be made by making slight improvements.

Then I conducted a Remote Ethnographic study with some fairly involved users working at  one of our clients, Garmin South Africa.

 

I asked these users to catalog a day in their lives at the office and the activities and contexts that they found themselves in.

 

I asked them to list in detail all the tasks, actions and interactions involved in the specific tasks they had to complete on the application daily.

 

Simultaneously I conducted Extreme User Interviews, sampling users that were very familiar and users that were completely unfamiliar with the product.

 

After this I conducted one last piece of research, which was a survey I sent out to roughly 3000 users. The survey dealt with Demographic, Psychographic & Ethnographic topics, and from this pool of users, a sizable amount of results came in, from which I narrowed down 40 respondents who filled in the survey most comprehensively.

 

All of this research combined enabled me to draw up 3 distinct personas with which to brainstorm and validate the designs that followed.

From the 3 personas I drew up, The Data Nerd was going to be the one that I validated the reporting interface functionality on the most. Aesthetically, I needed The Boardroom Commando to feel its sexyness and give the thumbs up for purchasing orders.

I set out creating wireframes for the reporting interfaces, and iterated over the course of a few weeks, constantly testing against internal users who fit my persona profile.

At the same time as revamping the reporting interfaces, I was tasked with making aesthetic UI decisions that would pull through to the rest of the application. This was slightly hard as Everlytic hadn’t at that point created a clear vision for where the product should take the brand visually. So I set out exploring a few ideas.

Reviewing these concepts and taking into consideration the type of enterprise clients I had to keep in mind while developing these UI ideas, I then realized that a safer, toned down version would probably achieve quicker gains in overall user uptake, and usability, and make for a faster developed front-end.

The outcome of this was that choosing a cleaner UI gave me the opportunity to very easily base the designs on an already existing UI Framework, namely Bootstrap.

 

I could use Bootstrap as a starting point, and slightly customize it to suit our needs, and in doing so, create a living pattern library for the developers to work off of, which resulted in very quick implementations of all the new interfaces across the application since then.

 

I leveraged Bootstraps usage of Less and could quickly redesign it the way I needed it to look. I also replaced Bootstrap v2.3.2’s glyph icon set with FontAwesome’s font icon set which gives us great flexibility in our UI’s.

All this did not result in the most original and aesthetically unique user interface, but it did speed up development tremendously, and solved our usability and aesthetic problems we faced at the time.

 

It does however provide a fantastic framework as a starting point to keep iterating and improve on over the following months.