Illustration | Design | Code
BLOBBY POP - APP REDESIGN
Skills
Overview
Javascript
HTML/CSS
Animation
UX Design
Illustration
Figma
This will be a case study to redesign the user experience and interface for an old project from my Input, Interaction and Accessibility class.
This project displays both coding and visual design skill.
Play the game here!
Summary
Blobby Pop was a small project assignment that me and my college classmate coded for our CSCI4849 course in 2018. The assignment was simply to create a desktop interactive program, which we were then expected to translate into some other form with the intent of keeping it user friendly for an audience of our choice. For instance, if we wanted to cater our program towards blind users, then we would need to implement a system like a screen reader that would allow blind users some alternative form of response from the program. For our project, we focused on translating our web game into a mobile format.
Objective
In this case study, I’ll be redesigning my game with better interfaces and additional pages that I would have liked to add to our game in both web and mobile variations. This will require sketches, low fidelity and high fidelity mockups, and task and userflows.
The Problem
Web problems:
-
Too much empty space between content
-
Background consists of realistic image > animation > solid color = no harmony
-
Doesn’t have relatable content or even the mascot/target on the front page
-
Color and font of words are not engaging
-
Target overlaps other assets
Mobile problems:
-
Buttons and instructions took up too much space
-
Target and buttons overlap other assets
Task Flow
Sketches
Demo