dolly's codebook

UX/UI design, data visualization

Senior Project was a class that as graduating students, we got full control over for the whole semester. I was able to choose the topic and medium in which it was done. These projects were then displayed in a gallery exhibition, where we designed and executed an 8ft. space that displayed our project and supporting pieces.

This project illustrates the brand I created-Dollyā€™s Codebook-along with an app featuring animations and a large extent of prototyping, a series of five posters that illustrates data collected from a survey, as well as exhibition details like 3D models and takeaway items such as stickers.

app design


Not only was this app designed at teaching women to learn the basics of programming and getting their feet wet within the discipline, but a key feature of Dollyā€™s Codebook is the ā€˜Code Yourselfā€™ function.

Here the user has the chance to learn how CSS can affect a webpage by changing attributes like background-color, padding, font-family, nav, etc.

Seeking to solve the issue of womenā€™s accessibility to learn to code. This issue arises becuase the job field that uses skills such as coding, is dominated by men. Therefore, the purpose of Dollyā€™s Codebook is to help educate and push women to learn to code, while going about their daily busy days.

Creating an educational application was my solution to this problem because of the target audience persona, being middle-aged on-the-go moms, they could take it with them anywhere they go.

problem

solution

The gamify aspect of Dollyā€™s Codebook was to make the experience more enjoyable. Programming is a seemingly complicated subject, which might scare someone into starting it. Therefore, the goal was to make it as approachable as possible, giving the audience a mission in mind while introducing fun characters and experience through the voice and narrative that was created for the brand.

target audience

Dollyā€™s Codebook targets middle aged on-the-go moms who never have enough hours in the day. Between taking care of kids and having a career, they donā€™t have time to themselves and go to school full-time to learn something they are unsure interests them.

standards


Hex, or Hexcode/Hexadecimal

Bonnie the Block

Tag the Tag

Conrad the Container

Throughout the app, the user meets characters that helps them along their journey. Each one relates to a coding term like a block or tag.

data visualization


In order to illustrate why Dollyā€™s Codebook would be useful in a real world application, and the importance of the subject of women in coding, I sent out a survey that had over 100 participants where I asked them various questions about their knowledge of coding and womenā€™s role in it.

This then went on to drive the data visualization part of the exhibition where real data was compared to actual data to show the difference and how aware people are of these discrepancies.

Other data was represented in
the form of a recipe card, showing individual responses.

exhibition details


For the exhibition, I learned how to create 3D models which I then used a CAD program to make the characters from the app in order to bring them from being in a 2D flat and digital space to something in the physical world.

Bonnie the Block, Hex, Tag, and Conrad the Container were also made into stickers for a takeaway item.

class: senior project duration: 12 weeks

process videos


This includes the beginning of ideation of brand, app, and data visualization as well as illustrations.

The production video focuses mainly on the physical aspects of the exhibition like painting, mounting, and creating the 3D models.