UX Design Project Portfolio – Ji Hwan Shin

Project: POREfect (Personalized beauty/skin care planning app)

Partner: Ashley Friedland

Professor: Azure Qian

Date: 12/16/18


For our project, we wanted to create an app that simplifies the process of finding out our skin types and getting product recommendations. Seeing the over-saturation of brands and inconsistent diagnosis on similar apps (Paula’s Choice & 你今天真好看). Allowed us to address some of these shortcomings on our own app. We wanted to provide a thorough skin diagnosis using a questionnaire that examines one’s skin care routine, diet, and lifestyle habits. With this information, we wanted to recommended customer reviewed and clinically approved products to our users. Lastly, our key feature would allow people to set up their personalized skin care routine and set alerts to check off items on their to-do list.

From our brainstorming, we identified two segments for potential user persona – those who are aware of skin care and incorporate several products into their routine and those who are unaware of the proper way to take care of their skin. We figured that our app would have to address both of these segment groups by simplifying the process and providing quality content (like skin care steps and product recommendations).

User Research, Personas, and Scenarios

We conducted our research to see of our user segmentation was correct. We prepared a survey on Google Forms about basic skin care knowledge as well as user input into what kind of functionality they would like to see in our app. You can check out the questionnaire here: https://goo.gl/forms/NvyRMZvSNFRbuMGE3

We got over 60 responses from people of all ages and nationalities. True to our expectations, there was almost an even divide in people who already had an established skin care routine and those who wished to learn more about skin care or had no clue at all what they were doing. We also had a wide range of responses from people with differing skin concerns that stemmed from genetic, hormonal, or hygienic reasons.

Looking at this data, we confirmed our initial assumptions and came up with two user personas – “Beth” and “Tati.”



Prototype (https://marvelapp.com/66fegh3)

Usability Test (Beta Version)

Some Recommendations:

  • Thumbprint login | Sign in with Google or Facebook
  • “These are suggestions not prescriptions”
  • Explanation of questionnaire
  • Skip questionnaire option

What we chose to incorporate:

  • Sign in with Google / Facebook
  • Suggestions not prescriptions
  • Skin care front page

What we chose to not incorporate:

  • Skip questionnaire option  – because the questionnaire is crucial to the app

Usability Test (Second Version)

Some Recommendations:

  • M and E for routine changed to icons
  • Questionnaire comes earlier in the app
  • Different colors
  • Bigger text

What we chose to incorporate:

  • M&E to a sun and moon
  • Different colors
  • Bigger text

What we chose to not incorporate:

  • Questionnaire earlier in app – not enough time

FULL User testing audio can be found in our Google Drive: https://drive.google.com/drive/folders/1b9lzovlgYEmkRqsX3libH2qhNQi2r498?usp=sharing


Presentation Slides: https://docs.google.com/presentation/d/1m-wlMS_N9tVKpAy-lPcOKdCGecjJ2EniaMBgGI6OAHk/edit?usp=sharing

UXD Assignment 2: User Persona – Ji Hwan Shin

Team: Ji Hwan Shin (Eric) and Ashley Friedland

In class, we mapped out some questions users might have, leading to our drafting of focus groups. We were thinking of the scenario and features the app might give to address the concerns users have.

For this week’s assignment, we had to collect user data in from a form of a survey or interview to group people into different user personas. For our app, since we are creating a skin care routine planner, we decided to gather information on our potential users’ demographics, beauty habits, and current skin care knowledge. We created a questionnaire with ten questions that encompassed a wide variety of skin care concerns as well as an option to input comments or questions. In 24 hours, we amassed more than 50 responses. Ashley also got two individual interviews, adding more information about our user base.

Survey Questions:


Survey Responses:


From the responses we got, we realized that a majority of participants were in their twenties, with a few mature audiences. As expected, many common concerns were about hormones, acne, diet, and frustrations with their skin care routine. We were able to group the users into two personas – misinformed and informed, with each user persona having different concerns and goals.

User Experience Design Assignment 1 – Ji Hwan Shin (Eric)

Team members: Ji Hwan Shin (Eric) & Ashley Friedland

Project Idea: Personalized Beauty Routine Planner

For our project, we wanted to create an app that can personalize one’s own beauty routine according to one’s skin type that can be found out through a series of questionnaires on the app. Then, there will be product recommendations, a to-do list and reminders to stick to your regimen for a special occasion or healthy lifelong habits.

Many similar apps exist but they seem to lack accuracy and recommend products that are either too expensive or unsuitable for people’s needs. We want to create an app that recommends products that have been tested by users and dermatologists to provide the most unbiased and effective advice. Our core task is the to do list and reminders that alert you to stick to your beauty plan. Because it is imperative for people to have a routine that they can stick to for the products to work effectively. Our project board is attached below:

Our storyboard:



Final Project Documentation – Ji Hwan Shin

Cultural Preservation Through Digital Restoration

As I proposed earlier, I wanted to create something that takes artifacts from the past and restores it digitally using the techniques of digital restoration and hybrid reassemblage. I was really inspired by the works of the Victoria and Albert Museum in London as well as photogrammetry and decided to create a replica of the Jadeite Cabbage to recapture the importance of craftsmanship, fertility, and auspiciousness jade carving had in the late Qing dynasty. First, I got an actual cabbage and took several pictures of it. I put those pictures through Agisoft then created a more realistic model by reducing polygons and building the mesh. Then, I patched up any holes and smoothed out the model even more on Meshlab and Meshmixer. I saved the model into an STL file to prepare it for 3D printing.

The printing process took about 5 hours and I got the model and placed it into an acrylic box I laser cut before the presentation. Overall, this was a very fulfilling project because I was able to learn a lot about using different machines and software to create a customized and innovative design. I just wish I had more time to perfect the model but given the time constraints I was pleased with what I was able to create and in the future I would like to do more with digital fabrication.


Assignment 3: Using a 3D Printer – Ji Hwan Shin

For this assignment, I used the same design I had made on Rhino, refined the materials a bit and sent it through a few different 3D Printers as an STL file. Using the JGAurora, Marcela helped me set up on the CURA software to stop the printing process up to the sole of the sneaker so that I can make it multi-colored. However, mid-way through the printing process I realized that the sole of the sneaker was not printing properly and had strange shapes. I realized that it was because in my sketch, the objects were not joined together, causing the system to think that there were multiple layers.

I was able to fix this problem by joining the surfaces together on Rhino but here was still the issue with the 3D printer. Even though I set the printer to stop after the sole, it kept printing and didn’t follow the settings I inputted into the file. So Marcela helped me use a different printer and glued the two pieces together.


Final Project Brief Report – Ji Hwan Shin

Bringing Back the Past with Restoration and  Reassemblage

For my final project I wanted to incorporate the ideas of digital restoration and hybrid reassemblage that I learned through the readings and online research. Digital restoration is the act of preserving or rebuilding historical artifacts with the use of 3D technology. For example, the Victoria and Albert Museum in London was able to model and recreate artifacts from Versailles that were damaged during the French Revolution. They used molds and 3D scanning to print the parts broken off. In the reading by Amit Zoran and Leah Buechley, I was able to learn about hybrid reassemblage which is the process of restoring broken ceramic using digital fabrication.

3D Technology in the Restoration of History


I’ve learned throughout history that many valuable artifacts from my home country were stolen and now are displayed in different countries around the world – mainly Japan and France. There are also other precious artifacts that are damaged or lost. I realized that through digital fabrication I can bring back these lost artifacts or even create my own piece that can bring relief to the loss of cultural heritage and bring more awareness to it. My friend recently visited a national museum in Taiwan and told me about a jadeite cabbage. It was basically jade that was carved into a cabbage during the Qing dynasty. Looking at the intricate carving, I realized that with photogrammetry and 3D printing, I can recreate it in only hours. Surely the quality and value wouldn’t be the same but seeing how quickly and efficiently I can recreate this model shows the we can do the same for all other historical artifacts. This technology, when applied can permeate the arts and education. Therefore, I would like to recreate this humorous but intricate model of the jadeite cabbage as a symbol of digital restoration and hybrid reassemblage.


3D Modeling Using Rhino Assignment – Ji Hwan Shin

For my 3D modeling challenge, I decided to try to design some sneakers. Watching this helpful tutorial online(https://www.youtube.com/watch?v=d6ZzSmjK0R8), I was able to learn how to use some functions we haven’t used in class. I started out by sketching out the outline of my sneakers which I then extruded.

To get equal shapes on each of the bottom surfaces, I projected the curve. Then, I trimmed the unwanted parts out, connected the surfaces using two curves, and the sweep2 function to cover the area with material.

For the top part, I again sketched out the design with curves and conjoined the area to put my foot in with an ellipse. To cover it all up, I used the network surface function which completed the model. The challenge for sure was getting the sketches symmetrical and having to match up point by point was excruciating. Because of a few points that were not exactly parallel, My surface area became rugged and incomplete. But I was pleased to become more comfortable with using Rhino and hope to improve on future attempts.

Digital Fabrication Week 1 Assignment – Ji Hwan Shin

For the first week we learned how to create 2D illustrations on Adobe Illustrator. We were to fabricate the 2D designs using the laser cutter, vinyl cutter, and embroidery machines. I chose to work with the laser cutter and embroidery machines to create memorabilia for someone special. Exporting my illustration to an svg file, I followed the steps we learned in class to utilize each of these machines.

  1. Laser Cutter

For the laser cutter, I was able to get the help of Jing Yi, who told me that in order to get the desired effects of my illustration, I should group each part of my illustration into layers. This was to make sure that the areas I want engraved and the areas I want to leave untouched can be separated. I outlined my hexagon with the stroke 0.1 to cut out the shape and made the areas I wanted etched out red so the machine could recognize them. Overall, I was satisfied with the result even though the grooves weren’t deep enough to be used as a stamp.


2. Embroidery Machine

For the embroidery machine, I had more difficulty because of the way my design was structured. I didn’t group the shapes and convert them to lines so the machine just assumed I wanted the shapes to overlap. The end result was the stitches getting caught together and somehow the bottom stitches came up. Next time, I would definitely make sure that my shapes are nicely grouped together and merged so that the machine can properly outline the stitches.


Final Web Based Project Documentation (Vasudevan)

Fantasia Valentina – The Face of Shanghai Drag

By: Ji Hwan Shin


For my final project, I decided to introduce an art form that is near and dear to my heart. Drag allowed me to be whoever I wanted and heal myself through artistic expression. Throughout my drag career here in Shanghai, I met some of the most talented and passionate queens. One of them, Fantasia Valentina, has been one of the first queens I performed with and is one of my closest friends. She is known for her flawless face and her makeup techniques are coveted by everyone in the community. I decided to introduce the world of Shanghai drag through the preparation stage – one of the most important process for a drag queen and one not seen by the audience. There are so many elements that go in before a queen can interact with the audience and perform. I wanted to create a website where users can go on a “tour” of that process by following along Fantasia’s preparation before a night out.

The interaction is quite simple. Once the page is loaded, users can choose the language. I thought it’d be only fair to include both English and Chinese languages as their respective usage reveals the differences in understanding and interpreting between cultures. Once users choose a language, they are led to a site with four stages. They are put in order and shows the footage of Fantasia getting ready as well as her voiceover detailing the process and commenting on her view of drag.

Due to time constraints, I was not able to include every possible steps in the website. Although I am highlighting the most important aspects of the makeup process, there were so many scenes I wanted to include that didn’t make it to the final cut. Also, there was also the issue of full representation. Of course, drag does not only include the aspects I introduced in my project. Many more styles and forms of drag exist, but I was focusing on one part of the drag community I can represent accurately. Finally, I do believe that the project could do more in terms of user interaction as the language function and aesthetic elements are really the only parts users can control and manipulate. Overall, I am very pleased with the end result and hope that more people are introduced to drag and get to know more about what does on behind the scenes.


Final Web Project Proposal (Vasudevan)

By: Ji Hwan Shin

For my final project, I decided to work alone on a web art project exploring the drag scene in Shanghai. Having been active in this community, I have collaborated with several performers with very different styles. I was inspired by this video: https://www.youtube.com/watch?v=r0o0PK7AXFE which talks about the New York drag scene. I also wanted to do a similar visual presentation that is interactive in having users know more about drag as an art form and the individuals behind the drag personas. Users will be able to see interviews, performance clips, as well as mini bios about the queens (and possibly a king). I hope that my work will bring more attention to the growing drag scene in Shanghai and inspire more people to explore this craft.