https://www.stephaniempng.com/contact daily 0.75 2021-04-10 https://www.stephaniempng.com/about daily 0.75 2021-11-30 https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/0b1e42ce-7dd7-480e-b278-b818de46f721/IMG_8008.jpg About https://www.stephaniempng.com/work daily 1.0 2025-09-29 https://www.stephaniempng.com/work/one-amazon monthly 0.5 2025-09-29 https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/d509f373-7b90-45e1-8f2f-6661b5986793/Screenshot+2025-09-29+at+5.59.44+PM.png https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/e45734df-4e37-4c8b-bfa2-c5d3eb0aad0d/Screenshot+2025-09-29+at+6.00.46+PM.png https://www.stephaniempng.com/work/uipractice monthly 0.5 2021-04-20 https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618913035457-9PW5MGPJ8CEX7BXGJZSY/Screenshot+2021-04-20+at+5.59.32+PM.png Work - UI Practice https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618913096524-FNBVZJU9U1SAKWWE95E3/Screenshot+2021-04-20+at+5.59.50+PM.png Work - UI Practice https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618913272161-XYBSK0I7TRSTBOJIUC3I/Screenshot+2021-04-20+at+6.06.23+PM.png Work - UI Practice https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618913336154-MHPI4XK4W6D4HP98JJMA/Screenshot+2021-04-20+at+6.06.52+PM.png Work - UI Practice https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618913404842-U9EUG7RX3GNV6WKGSGUY/Screenshot+2021-04-20+at+6.07.10+PM.png Work - UI Practice https://www.stephaniempng.com/work/gramcity monthly 0.5 2021-04-20 https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618906737871-2D6SPZLOB3LAWY9QUZ8R/Screenshot+2021-04-20+at+4.11.26+PM.png Work - GramCity Sarah: Behavior: Sarah travels a lot for her job, and with her spare time between events in new cities likes to take photos after participating in a photography class a few years prior. As a person who likes to plan her days around the photos she wants to take, prior to travelling Sarah will take time looking through social media sites such as Pinterest and Instagram to get inspiration. Frustrations: Sarah doesn’t have much time in one city, and therefore strives to get the best images when she is there. Though she isn’t bothered by travelling long distances for a great photo, she feels like she has wasted her time if the place isn’t what she expected. Sarah dedicates a lot of time looking through other people’s photos to find places, and if it isn’t well known finding the details on the location will be even more time consuming. She also likes to see different ways people take photos of the same place, but doesn’t want to waste time scrolling through “average” photos to find good ones. Goals: Sarah wants to have an easy way to find locations and examples of the best photo opportunities the city provides, which would make her planning process much smoother. Nick: Behavior: Nick is someone who takes a lot of road trips everywhere, thoroughly enjoys traveling, documenting, and sharing his images with friends and social media. When in a new place, Nick will spend a bulk of his time exploring for most of the day and doesn’t feel the need to have a set plan of where he will go. Frustrations: Nick sometimes struggles to find a balance between regretting not taking enough pictures, and missing out on the true traveling experience if he is spending too much time taking pictures. He likes to take a few photos of activities that he is doing, but also gets irritated that he may have missed out on photo opportunities that were near him. Goals: Nick loves to find places to document and capture photos of his trips, but he also doesn’t want to trouble himself to spend time finding or travelling far to these places. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618906902604-ZKHIXGJF2RTUDPODV065/Screenshot+2021-04-20+at+4.16.52+PM.png Work - GramCity Possible end-to-end experiences Ideas: A snap map view of photos posted where, and then people rating other people’s photos or liking it and pushing it as a place you should take photos Individual profiles can show where they have travelled and the places and then people can look through those profiles to see the photos they have posted where they have taken it Different forums for locations for photo taking where individuals can share the different places they have been https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618908309253-318DZ7AOEGQ7UYXM6ZFB/Screenshot+2021-04-20+at+4.44.10+PM.png Work - GramCity In the above image I sketched 8 possible solutions using the Crazy 8 method. Within the 8 screens that I drew, I chose the 5th sketch as the most critical screen. I believe that this incorporates what GramCity is looking for the most. It creates an active community between the users as they share their photos as well as others being able to comment, and share their experiences. As seen in the sketch this is the interaction under “Hong Kong Chat Forum”, therefore making it specific to those who are travelling to Hong Kong. Furthermore, it incorporates the idea of GramCity users' profiles being visible. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618908478631-CDJTHI1XAFMDO0EYGUC0/Screenshot+2021-04-20+at+4.46.54+PM.png Work - GramCity This is the three-panel board solution sketch I drew with the middle panel as the critical screen itself. The first panel shows individuals searching for their specific city forum they wish to visit. As shown in the search bar, the user inputted “Hong Kong” and the resulting forum was shown. Below that it showed previously viewed forums by the user as well. The second panel shows a specific post made by a user alongside images, reviews, location, and engagement from other users. The last panel shows the GramCity individual’s profile with a “saved” board intended for later use. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618908661510-F0V5VPCOBIXOW3FUYP35/Screenshot+2021-04-20+at+4.50.28+PM.png Work - GramCity When creating the storyboard I had essential elements that I wanted to include. First of all, I wanted to demonstrate how forums would work. There would be a news feed of posts from different users and also displaying that others can interact with posts through likes and comments. Furthermore, I as a user am able to expand on that post and save it to a specific collection. Users are able to create collections for certain places they wish to visit and then have a compilation of locations and photo references in the collection. As you can see in the account page, there are multiple locations (London, Madrid, Hanoi, Hong Kong), and upon expanding one there is a main photo with the location. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618909744169-0NAPWLD9TR6UU3QL1HLW/Screenshot+2021-04-20+at+5.08.28+PM.png Work - GramCity Originally, these were some of the wireframes that I created. I used Marvel to create these two screens that I decided to display. In the first image, this is how I intended the location forum to look. There is an obvious search bar, search results, and previously searched. After choosing the relevant forum, the expanded page included six posts. Each post included a photo, location tag, profile image, profile name, likes, and comments. The posts are able to be blown-up across the screen, profiles are linked, and the comments and likes are interactable with other users. To be honest, I didn’t enjoy this prototype process using Marvel as I thought it limited what I can and cannot do. Therefore I decided to do a few wireframes only and quickly proceed to testing, and reiterate my designs on Sketch after receiving necessary feedback. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618909963059-GZ4XGH2GAL6367P6OUGR/Screenshot+2021-04-20+at+5.12.05+PM.png Work - GramCity As I was only meant to spend a maximum of a couple hours per day for the 5 days this is the furthest iteration that I had after the design sprint. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/6bf613cd-86cf-4a18-b4c9-ac1599033bc4/Screenshot+2021-04-20+at+4.34.12+PM.png Work - GramCity https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/dd716473-75f2-49ba-a978-67f35934ea4f/Screenshot+2021-04-20+at+4.26.47+PM.png Work - GramCity https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/18831f46-17ea-4180-877f-a6d54ca16f79/Screenshot+2021-04-20+at+4.32.14+PM.png Work - GramCity https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/e3872b45-f676-4d3f-9465-e11e036bed9c/Screenshot+2021-04-20+at+4.32.06+PM.png Work - GramCity https://www.stephaniempng.com/work/huddle monthly 0.5 2021-04-20 https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618846699446-C7ISAZXCXZNV2M4UXO8B/Screenshot+2021-04-19+at+11.35.30+PM.png Work - Huddle I audited three companies specifically in relation to the social aspect of their application to aid me in my own design process. From the applications, I found that news feed were a recurring theme to engage with others. Furthermore, users are able to share classes/experiences with others. Something I specifically liked was the Fitbit personal messaging feature. Fitbit goes beyond just the public news feed but incorporates a more personal feature of communication that I think users would definitely benefit from for Huddle. Fitbit also adds a game like aspect by having “badges and trophies” which I think could really increase user engagement as well. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618839071376-Y0GHINALOQPZABKF0TZB/Screenshot+2021-04-19+at+9.28.06+PM.png Work - Huddle https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618839149472-0URH5MNDBIM1OCXW1YO0/Screenshot+2021-04-19+at+9.28.30+PM.png Work - Huddle https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618416087580-RH128496O8KV9QG15SCK/Screenshot+2021-04-15+at+12.00.22+AM.png Work - Huddle The challenge tab is a new feature I wanted to incorporate. Users are able to accept challenges as well as challenge their friends. This feature adds a game-like competitive aspect as there is a leaderboard and points system. For the social aspect, there is a news feed and messaging feature. On a user’s news feed they are able to see what individuals post and interact with it, as well as share something of their own. The messaging tabs displays recent conversations, and upon expanding it is their chat. Users are also able to add new friends through multiple platforms. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618417089537-JHYIX2X6NC0TT642VMVH/Screenshot+2021-04-15+at+12.17.08+AM.png Work - Huddle The first image is the home screen which houses the for you and challenges page. On the for you page, users are able to browse classes and clubs and attend them. Upon finishing a class, statistics from the class will be demonstrated. The following screens show how a user can share their class through messaging or even posting. The second hand-drawn image shows what the profile of an individual looks like. On the profile, it showcases individual statistics such as clubs, friends, and goals. There is also a ribbon showcase which is linked to the amount of challenges one achieves. To incorporate the messaging feature, users are able to share recent activity and goals to friends. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618420610702-QX2MRFOJF3HWMH38MLYV/Screenshot+2021-04-15+at+1.16.08+AM.png Work - Huddle https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618839829535-KWH8I0YI093L1Q7E300J/Screenshot+2021-04-19+at+9.42.54+PM.png Work - Huddle https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618839396347-SGI54WCACY558PBI7GLL/Screenshot+2021-04-19+at+9.35.47+PM.png Work - Huddle https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618839521499-D5PZ0B69KJUMRAF8FC0A/Screenshot+2021-04-19+at+9.37.41+PM.png Work - Huddle https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618839711281-HAGVVDJL3AM0NA7GZ1CC/Screenshot+2021-04-19+at+9.41.14+PM.png Work - Huddle https://www.stephaniempng.com/work/breeze monthly 0.5 2021-04-20 https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618504875482-HS2H7HFGUDURBOTWGL8J/Screenshot+2021-04-16+at+12.39.21+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618505087085-QW64456MPM7F16R7SCMM/Screenshot+2021-04-15+at+2.34.00+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618505708301-KTCUBS8YLO430IQI84HN/Screenshot+2021-04-16+at+12.52.57+AM.png Work - Breeze An idea I originally had was a constant reminder system. As interviewees have stated, it is much easier to input things onto a calendar versus following through with it. Having the application send constant reminders helps to ensure that you can’t forget the tasks at hand as easily. Another idea incorporated a collaboration aspect that allowed schedules to be made visible to others. Many times we find it difficult to reach out to others simply because we don’t know if they are available or not, but by having this shared platform it eases the tension to coordinate between people. In light of Covid-19, there is also a huge issue regarding timezone making this feature ever more essential. From making meetings to reaching out to a friend, this visibility can help individuals make a concrete schedule for themselves to follow through on. Thirdly, I thought of a potential communication board. On this feature, individuals can post tasks they finished or plan to complete. Having motivation from others can help to complete certain tasks. I also made a note to myself that I wanted to make sure the application was aesthetic and visual. The ability to visualize exactly how their time will be allocated throughout the day/week/month is very helpful. Furthermore, the ability to see a task get checked off gives instant gratification that they have achieved something, and have the ability to keep moving forward. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618506684583-HS6IFV2NO1GD8HJK2ZT2/Screenshot+2021-04-16+at+1.10.37+AM.png Work - Breeze When sketching out the red routes for my application, I found myself simplifying it to what was truly necessary. I previously had an idea to include a communication board, but realized that this was disadvantageous to users. A communication board might cause unnecessary stress to users, and distract them from work as it resembles a “social media” platform. For my guerilla usability testing, I decided to go to a coffee shop to test my paper prototypes of my application. I tested the prototype with five people who were available, fluent in english, and have an understanding in using mobile devices. As this is a low fidelity mockup, I am interested in doing a test early on to find out large usability issues. Some specific things I wanted to focus on was the flow of the screens, whether the buttons/labels are clear, and what improvements/additions are needed to achieve the purpose of the productivity application. The tasks that I wanted the individuals to complete included creating a fake scenario in which they have to enter in a task with a due date and description that is urgent and involves collaboration, and connecting with other individuals to work on tasks together. While completing these tasks, participants encountered confusion and therefore I saw aspects of the design that needed changes. First of all, I think that the users were sometimes confused as to what certain icons represent and some may have had overlapping meanings. For example, in terms of the scheduling there is a message and invitation button but some didn’t know which to press and what the difference was. Therefore, I decided that the messaging function wasn’t necessary for this app as it isn’t used for communication and rather the invitation is more suited as you are trying to find times to collaborate. Another issue was that labeling was sometimes confusing. Many didn’t know what “projects” meant, and I had to clarify that it means “overarching subject”. Individuals also wish to have more clarification on specifically what should appear on each screen. Not only did I realize changes that needed to be made, but more importantly I realized that I should simplify what I am trying to do with my app as it may be overloading users. Moreover, I wanted an application to help make it easier for individuals to keep themselves accountable to things that they plan for themselves and therefore I want to focus my design more towards that such as reminders, additional notifications etc. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618507457895-3SIP18JFPRHACR73UD4N/Screenshot+2021-04-16+at+1.21.44+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618509473089-EDZL3NDIA85CAF57MHI0/Screenshot+2021-04-16+at+1.55.38+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618509641273-ZQSKW988CZ2EG6Y8IBU3/Screenshot+2021-04-16+at+1.59.16+AM.png Work - Breeze As you can see above, the name of my application is Breeze. Along with the calming nature the name entails, I took to my mood board and style guide the same approach. The images, colors, and icons utilized colors synonymous with calmness and simplicity. https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618511570569-UI2YQ6TA1SSMUEENFVNS/Screenshot+2021-04-16+at+2.13.32+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618511921249-K6G690VXJ7S65RBL9NFL/Screenshot+2021-04-16+at+2.38.23+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618512092566-EQIDZCBB2MJRT4QYQ7MV/Screenshot+2021-04-16+at+2.39.15+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618513704586-VW72P8LUTQ2LSKTFWKFC/Screenshot+2021-04-16+at+3.06.39+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618514730184-3O31JC4SVBIP1U4WGUQ0/Screenshot+2021-04-16+at+3.25.12+AM.png Work - Breeze https://images.squarespace-cdn.com/content/v1/606dd07432951c500eb898d5/1618514339797-E9YVQSIX7ORD56O3C55L/Screenshot+2021-04-16+at+3.17.52+AM.png Work - Breeze