Case Study — The Bix Boox Website
My fourth design project at Red Academy was a great experience. I got to work in a group of 4, with individuals whom all posses unique qualities and different skill sets. I believe we collaborated extremely well and came together using our strengths as one on the design for this site.
The Client
Our client was a brilliant father and son duo who together operated their business called Bickson2. Our first impression based on the brief given to us was that Bickson2 was a consulting firm like all others here in the lower mainland, and that’s all. We checked their website and did not get a lot of information from it. Just a piece of paper with information on it was given to us what all millennials would do, we googled them. You can imagine our surprise when we started our research on their website and see this image.
As you can imagine our confusion was at its peak at this point. We continued to search the internet for any information we could get outside their main website. Other than a few tidbits from Linkedin and a Facebook page, that hasn’t been updated since medieval times it came time to meet the Bickson’s.
The very first time you meet Bix and Joe, your entire concept if what you thought a consultant was supposed to be changes. They weren’t two suits who came in and sat down and talked as though they have figured out the cure for idiocy. Instead they were funny, engaging and really charismatic. Their positivity vibes through the room constantly and it becomes contagious instantly. They really aren’t just consultants, they are so much more. They are very outgoing individuals who have a deep understanding and connection to what they do. They have transformational conversations with people and organizations to make them better, and They have an elite level of expertise, over 30 years worth!
Opportunity/Problem
Bix Bickson has written his life’s experiences in a 38 page interactive workbook. The book was fully complete and they had already purchased the domain www.bixbook.com. They wanted to ensure that they had a site created with the users interests being put first while accomplishing their goals.
Deliverables
- Create a desktop and mobile site prototype for the Bix Book
- Have a “pay what you want model” of income for the book
- Create a form of user interaction on the site
- Giving readers exposure and access to www.bickson2.com
The Research
Surveys
For the Bix Book page we decided to create two separate surveys, as our target audience was being categorized into two separate sections. The first was of Bix’s past clients, and the second being for public information.
The past client Survey gave us a greater understanding of how Bix is viewed and respected after he has worked with his clients and their organizations. It also told us some of the hurdles his past clients had dealt with prior to finding Bix.
The Public Survey was created to better help us understand where potential users might venture to find inspirational content and also give us a bit of the demographic that might be interested in this product.
User Interviews
We conducted multiple interviews with people who have worked with Bix. They all had very positive things to say about him, they felt as though his methods were very unique and his practices were like nothing they had ever witnessed before. It also gave us a great understanding how truly Bix believes in his methodologies and implements them with maximum efficiency leaving a lasting impression on all.
Persona
We created a persona to allow us to consolidate all of our users from our research into a single entity. Designing for a specific somebody rather than a generic everybody helped us streamline the design process. Earlier I spoke of how our research helped us with our our demographic and finding out past hurdles of previous clients. We portrayed both those things in our persona. The common demographic was a female executive with a passion for success and gaining knowledge. Her Frustrations were ones that bix’s previous clients had to deal with before they found what they were looking for in Mr. Bickson.
Domain Research / Competative Comparative
Domain research was very extensive for us. We ventured to multiple sites for information on user interactions, comments sections, payment models, and the list goes on. There were lots of similar concepts to our own, but nothing directly the same. Our client had also recommended a few domains for which they had appreciation for, and we definitely took those into consideration too.
With our Research completed it was time to plan our attack!
Planning
User Flow
Our user flow consisted of us creating the way our users would go through the site. We used contextual inquiry from our research on other sites to depict how this would look. We watch as possible users used other sites similar to what we were trying to create.
There were a few hurdles that our users had encountered on while navigating the similar sites.
The user flow was extremely helpful to us when setting up our site map, and journey maps.
The focal point of our site map was the “download book” portion. We needed to ensure there was a seamless to that page and the process of download within itself was also just as seamless as getting there.
To ensure we left no pain points out on our site out we created a journey map. As you can see we want to ensure maximum retention on the site, and are hoping not to have any early drop offs.
Design
we started our design phase using whiteboards and paper sketching rough ideas for the site. As you can see above we came up with a layout for the site quite easily. The site map and journey map definitely helped speed up the process.
Style Guide
We created a style guide of features for the site like colours and typography. Our research of Bix’s past clients gave us an understanding of how he is viewed. We wanted to include all the positive attributes his clients see in him and therefore we were very peculiar with our selections.
Having powerful imagery was a must as our surveys had countlessly expressed an interest in having images present in the final product to ease the heavy reading content. Also images are present through every story in the book already it was only natural to continue the trend. The gold type colour was an easy selection, as it was already used in the book many times before, and in order to contrast that we chose a blue which would inspire a calming and trustworthy feel to the book, while also maintaining a professional attitude.
Titillium was the font we chose for the headlines and titles. It is a very clean and sleek font, that pops out at the user for more focus.
Roboto font was used for the body. It portrays a natural reading rhythm feel as well as pushes the emotions of words forward. It reinforces the powerful message Bix Bickson is trying to send.
Testing
During testing we found ourselves needing to make two major changes.
The first change we made was the layout of our stories. We originally had it set up so you could read 3 stories but had a view of all 38 stories. Our client wanted a maximum of three stories to be present on the site without having to download the whole book. The problem was the frustration users had with the non readable stories. They would continuously click on them to read but would not be able to open them. we changed this to only show the three sample stories to end that issue.
The second major change we made was to the homepage. Our testers did not understand that the images were clickable links to the stories page. We created a hover button feature to showcase that more as we want the users to read the sample stories as a priority.
Prototype
Our prototype was designed on Sketch for both desktop and mobile. Invision App was used to bring it to life and our stellar web development students at RED Academy made it real!.…. check it out in this link!
