Company

Bookmart

Roles

User Experience Designer, User Interface Designer, Front-End Developer, Branding

Summary

Bookmart, an online bookstore and reading app, was designed with students in mind. Its main objective was to offer a better platform to buy and read eBooks (completely and by chapters) through their eCommerce website and their iOS app.

As part of this start-up company I worked alongside Back-End and iOS programmers as a UX and UI Designer and Front-End Developer to bring both their eCommerce website and iOS app to life.

User Research

I joined Bookmart's team after they had already discovered a problem and were working on a solution. One of the first things I did was research existing reading apps to help us learn about what currently works and what doesn't.

Bookmart app research

They had already ran a couple of user interviews, but I was able to perform another one with a group of 6 freshmen college students.

Questions were open-ended and included topics such as:

  • What applications are you using to read books, chapters and papers?
  • Do you use any additional tools to help you study?
  • Aside from reading, what other things do you wish you could do within the app?
  • Which features do you like and don't like about the apps you are currently using?

Compiling their answers with the ones obtained during previous interviews we were able to highlight the aspects we wanted to focus our attention on.

Design Process

Bookmart logo change

Bookmart already had a logo when I joined the team, but it was outdated and it didn't represent what they wanted. One of my first tasks was to work on their new logo. Once we had agreed on a new design I created new business cards and updated Bookmart's social media accounts to reflect the changes.

Bookmart iPad app design

Once we had established a new logo and style guide I began working on designing the iPad app. Using the things we had learned from user interviews and by researching the market we established the screens we would need.

I worked alongside our iOS programmer to make sure the design was feasible and that I wasn't including features that would delay our progress. I later created all the assets the developer needed to be able to put the app together.

We tested our app with several students. Some of their observations led to additions suchs as a section for them to take notes. We also added the option to create folders so students could organize the material by semester, subject, teacher and other categories.

Bookmart responsive website wireframe

Wireframes were used to determine the website's structure and to help us figure out the sequence of actions we would allow throughout it.

We knew it was very important for our eCommerce website to be responsive, so it was one of my main priorities when I first began designing it. The website was going to be the initial point of contact with the user, where they could browse and purchase books or chapters. Then they would log in to Bookmart's app on their tablet and the content they had purchased would be added to their account. For this reason it was very important to make the website as easy to use as possible and available no matter which device it was being viewed on.

Bookmart eCommerce responsive website

I organized usability tests for the website while I was designing it. Through iterations we landed on a final design which included a much better search system than what we had originally started with as well as better information heriarchy so the user could easily navigate the site to find what they were looking for.

Once we were satisfied with our results I was in charge of the front-end, implementing the design using HTML, CSS and Javascript. I worked alongside back-end developers to make sure they had everything they needed to complete their part and to ensure no feature or element got lost along the way.

Bookmart Admin Panel

After the website was completed and running, I moved on to design and implement the Admin Control Panel. This interface was created for publishers to use whenever they wanted to upload ebooks. With it they were able to upload content, set prices, descriptions, among other information. It was also used by Bookmart's team to manage users and other pertinent information.

Once again I worked alongside back-end developers to get it up and running.

Other Projects

Interested?

Drop me a line at letstalk@cmdesign.me, I would love to hear from you!