Interaction Design

As an Interaction Design Major, I've created numerous UX projects and designs across all sorts of platforms that don't have full case studies. These are some I wanted to highlight.

flower.png
 
Color of Change Mobile UI
Color of Change Mobile UI Mockup; Photoshop

Color of Change Mobile UI Mockup; Figma, Photoshop

About

Color of Change is a progressive nonprofit civil rights advocacy organization in the United States. It had a website but no mobile app at the time of creating this project, so this was what I designed visual UI for. 

I started by doing competitive research on the websites of similar organizations like BLM and BAJI, taking note of the colors, typefaces, images, graphics, and language they used to strike their tone, and then created a style tile for Color of Change. I created a menu with icons that fit their brand and tried to imagine what the mobile versions of their web screens could be.

Tools:

Figma, Illustrator, Keynote, Photoshop

Skills:

UI design, competitive research and analysis, icon design, style guide, responsive design

Color of Change Process Book; Keynote

 
 
Gasifier Co.
Gasifier Co. Website Mockup; Figma, Photoshop

Gasifier Co. Website Mockup; Figma, Photoshop

About

For my Climate Design class, I worked with a partner (Evan Tang) to elevate the climate solution waste-to-energy, and specifically gasification. Over the course of the semester, we identified the issue that many people do not know gasification even exists or what it is and that 

Tools:

Mural, Figma, ProCreate, Photoshop, Unreal Engine 4, Fusion 360

Skills:

Research, rapid idea generation, storyboard, mockups, website, wire-frame, animation, UI design, illustration, 3D modeling, 3D environment design, graphic design, story-telling

Final Presentation

Final Slides and Appendix; Google Slides

 
Chimera Kiosk
Chimera Kiosk Mockup; Photoshop

Chimera Kiosk Mockup; Figma, Photoshop

About

The idea behind this project was to design a kiosk or tablet interface in which CCA students could learn about an artist and create a piece of work in their style. I started by researching different Instagram artists I knew about and chose one to write an overview about. I created a concept map to better understand my artist's work and then started figuring out how to organize the information on the Chimera Kiosk app through a site map, design story, metadata, content listing, and UI sketches. After defining the structure of the app, I created a prototype of it in Figma and designed the UI.

Tools:

ProCreate, Figma, Photoshop

Skills:

Research, concept map, site map, design story, metadata, UI design, wireframe, mockup

Chimera Kiosk Screens; Figma

Chimera Kiosk: ZHK Designs Process Book; Google Slides