A significant design style guide can infuse a product with distinct characteristics and give users a unique personality. Collaborating closely with the Last GameBoard's art director, I meticulously assembled the puzzle step by step. Our process commenced with crafting the primary color scheme and establishing the central style for key elements. The outcome was a comprehensive design guide that serves as a valuable resource for designers and developers alike. This guide ensures a streamlined approach, enabling them to create content and features more efficiently and expeditiously. Click here to download Style Guide PDF.

The Last GameBoard App, also called "Gameboard Companion: Join Play," marked a transformative project that converted users' mobile phones into game access keys and controllers. This innovative app facilitated seamless local WiFi or internet pairing, connecting users to the Gameboard device. My role encompassed comprehensive responsibilities, beginning with defining user flows and creating an app site map. This laid the foundation for the subsequent phase of my involvement, wherein I undertook the development下午 08:26 2023/9/6 of the entire interface.
Click here to download complete UI PDF | Click here to download the user flows and wireframes | Click here forFigma Prototype

As a Senior UX Designer in the Age of Learning MMA team, my main gig was ensuring our games and activities were a breeze for our young users to jump into. Our games were like a fun math lesson party – they mixed cool curriculum stuff, especially math, into awesome virtual worlds. Kids got to tackle both the math challenges and the game adventures. My task was to find that perfect sweet spot, blending excitement, fun, and learning all rolled into one awesome experience for the students.

2Belive is your go-to online hangout spot, but with a twist – it's tailored exclusively for school and education needs. Picture this: online video meetings built just for learning. So, here's what I did: armed with feature requests and after some brainstorming sessions with the team, I played the wireframes wizard. I pieced together the layout for all the important bits in each session. And then, ta-da, I whipped up the first UI design mockups that set the tone for the whole experience. Click here to see the Wireframes PDF

I teamed up with curriculum and game designers in this project to create awesome UX for 3rd to 5th-grade math games. These games were a step up from the usual, diving into division and fractions. To make sure everything was super clear, I crafted wireframes and interactive prototypes. These prototypes weren't just for looks – they were the MVPs for pitching ideas and testing with the users. Click here to see Division prototype and Multiplication prototype

Bundled with the AILA child app, the AILA parent app is a smartphone app that provides AILA parents with an easy way to monitor and manage their children's accounts. It can remotely edit the child's account, view the daily usage report, and oversee their learning progress. The app is related to the AILA child app but needs to redesign the overall style for the interface to fit with the parent users. Click here to see the design UX documents (user flows and wireframes).

MAIA is an adaptive, AI-powered learning chatbot for K-12 English Language Learners. MAIA empowers teachers by giving them the ability to provide personalized instruction to each ELL student through frontloading lessons. What you see above are the mockups for redesigning the product interfaces. It is still undergoing development. By revising the UI design, we will provide users with a better visual experience.
Click here see the original UI design | Click here to see the user flows and wireframes

DMAI Authoring Tool is a web application that enables users to create learning content, lessons, and courses using text, media, and interactions. Mainly, such content is developed for use in LMS and can be saved in various formats. It is still an ongoing project, and I was in charge of helping them redefine all the user experience and functions. The complete user flows/sitemap and wireframes for all the features allow both UX/UI designers and developers to obtain a clear view of the entire product.
Click here to browse the complete UX/PDF document

When I joined DMAI as a senior UX/UI design lead, one of the biggest missions was to help them define and set up a standard process for project development from the beginning through the approval and delivery. The process involves cross-team members such as the product owner, project manager, tech lead, and marketing lead. After the presentation and instruction, people from different teams learned about what roles they would play and what is responsible in each stage.
Click here to see the Presentation PDF

While engineers were developing all the features for the Authoring Tool site, we also planned to redesign the theme style for better branding and visual quality. These mockups covered the main screens for the Authoring Tool website.

The pet park was one of the existing core features on ABCmouse.com. Initially, it was designed for young users to have a virtual pet that they could feed or water the pet. Also, the team can promote some educational activities by showing them on the pet screen. However, after it was released, they discovered that after visiting the section, most users wouldn't come back anymore. I was the creative and UI lead on this project, and I had to find out what caused the users to leave and how we could improve the user experience. The new pet park was released a few months ago, and quickly the average time users spend and the rate of revisiting were both increases over 35%. I am glad it works great.

Download PDF Open Prorotype

Another existing key feature on ABCmouse.com that needed to be redesigned. The Learning Path is a section that provides a series of learning activities that young users need to do individually. It has a similar problem to the pet park in that young users got tired and bored quickly after trying a few times and hardly revisited the section. When we have this type of UX issue, I will always start with inspecting/defining the issue. In this case, no initial motivation can drive young users to keep doing the learning activities (the ticket reward is not working). Therefore, I decided to build a game/story-like user experience and combine it with a series of learning activities. I create the wireframes and prototypes and put them to user testing with pre-k through 2nd-grade children. The test result turned out very impressive. The users' engagement was improved hugely. The storyline attracted all the tested kids, and they couldn't stop playing more activities. This project is now under the design and production process and should be able to be released soon.

Download PDF Watch Video

Here are some of my previous user flows documents. User flows are essential for mapping out the concept for a project and providing the designer with a vision of how the users will go through the process to reach their goals. Moreover, the designers and developers can visually review the logical flows of the concept, make sure it is technically accurate, and cover all scenarios and requirements. Please download the PDF files for the details.

Download PDF

The main objective of this project was to provide the ABCmouse site master with a clear and well-organized web application to manage the ABCmouse home-screen content. The site master will have access to upload/remove banners, set up the specific display time, choose the particular group of users to display, and submit changes for QA review. I was in charge of mapping out all the main features with the user flows and mocking up the general wireframes with the detailed functionality description so we could go over and review the plan.

Download PDF

Back buttons are prevalent for many websites and applications. However, it is also a problem when the number of content pages and subcategories becomes bigger. It is always a question for UX designers: by clicking the back button, the users should go back to the previous page they visited or the upper level from the current viewing page. Sometimes, the rules are mixed and make its users even more confused. Therefore, I made this small document and defined the UX behavior rule on tapping/clicking the back button in the ABCmouse application so our users and developers will have a consistent rule on the back button.

Download PDF

When developing a new project, it is important to research some of the major competitors' products. By looking at these similar featured apps, we could adopt some of their nice parts and avoid some mistakes they made. This document is the final report based on four individual teardown research on each book app. It provides a clear comparison of the key features, and the best of four significant experiences include content variety, onboarding process, browsing experience, and the reading/playing experience. This can help the developing team set up the appropriate direction for the new project.

Download Original PDF

I worked with five other junior-mid-level UX designers at the Age of Learning company. As a leader, I supervise their work and help them by sharing my knowledge. Routinely, I will arrange team training meetings with presentations that are about new design principles or how to be a better designer. This example presentation was to train our UX designers on doing user tests with an appropriate approach from the beginning of the preparation for the test to analyzing the test data and writing the report after the test.

Download PDF

This is teardown research for Marvel Future Fight, a popular mobile game. The primary purpose was to study its daily challenges and rewards systems and see how it could improve the users' engagement in revisiting the app and playing more. By looking into some other competitor's products, we could quickly adopt something they are doing good and avoid some mistakes they might have. This is one of the critical steps before we really start developing a new concept for a project.

Download PDF

This PDF document was created for an internal training session to help other UI/UX designers understand how they should collaborate when joining a Scrum team and their roles as team players. One of the most important concepts I shared was the value between product owners, programmers, and UI/UX designers. On page 10, you will see how they might affect each other, and the perfect solution/result will only be satisfied by these three aspects.

Download PDF

To validate the concept of new user experience, it is important to run the prototype test with real target users. This is an example PDF document for reviewing the user testing and reporting the key learnings from the test. As a senior UX design Lead, I will conduct user tests from beginning to end, including defining the test goals, preparing the prototype and test script, observing the test, writing my test review, and presenting the test result to the team.

Download PDF

Nabi XD Launcher (also called "Smart Screen") was released at the end of 2012. Nabi XD tablets targeted audience is teenagers. To make the product more customizable, we provided users a way to set up their screens and allow dynamic home screens upon time and location. As the lead designer on UI and UX for this project, I worked closely with other designers and engineers to ensure the UI and flows met the business objectives.

Spinlet+ TV is an online cartoon streaming and watching application for kids. It is supported by Cookie Jar TV, which has over 700 hours of kid-safe entertainment. The challenge was designing the UI and UX that kids could use without trouble. I had to conduct extensive research to understand kids' behavior to make it a successful product. Many questions were essential in solving the puzzle. I was put in charge of this project to design and develop the visual solution and make sure all UI and UX would be comprehensive and enjoyable for kid users. This app soon became one of the key features for all nearby tablets.

Nabigator is an Android and iOS app for parents to install on their cell-phone so they can remotely do all the parental controls on their kid’s tablets. Moreover, it also connects with kid’s tablets via instant messages, email, and shared photos. I was in charge of developing the UI/UX for this project. One of the biggest challenges was the consistent issue of UI and UX patterns cross the whole application because it combines more than eight different individual Apps into one. I spent a long time redefining the app so users can use the app with a smooth and united user experience.

Just as it was named, Nabi Sync is a PC and MAC application that allows users to synchronize photos, music, and movies and transfer them to and from the Nabi tablet. One of the things that no one had tried before (at that time) was that we had to figure out how to make this happen "WIRELESSLY." The sync function is common for most platforms, but syncing with no cord is a whole new story. Questions like "How a user can get started?", "What should they look like first?" pops up instantly. Most importantly, how can we ensure that young users will still be protected by parental control? All these questions are where I would come in handy.

The Nabi App Zone is an application that young users can buy, download, and manage their apps, music, eBooks, and movies from their Nabi tablets. In other words, it's just like a Nabi version of iTune, but all contents are pre-selected and are appropriate for kids. I was assigned to oversee the checkout process and purchase section. Working with other designers and providing my commentary (feedback) was a pleasure. Sometimes, the best way to learn is to teach.

What is the world's most popular TCG game? The answer might be simple: Yu-Gi-Oh! (A card game manufactured by Konami). I was asked to re-design the official Yu-Gi_Oh website for the US market in 2008. I had to make sure the style would fit Konami's guidelines, but we will still have some features we wanted to add. Again, to my dismay, Upper Deck is no longer running this product.

POS (point of sale) is the battlefront where a product will fight its competitor. At FUHU company, I would often help the marketing team come up with the highest quality POS image like this one. That is very helpful and critical of them when making a business proposal because we need to visually show our business partners the best ideas to earn their business. This example was made in a day using Adobe Photoshop only (no 3D software).

I am majoring in Interactive Design and Game Development at SCAD. Therefore, I am well-qualified to work on game UI and UX. Mini Mogul was a preloaded game for a newbie tablet. I was in charge of the UI side of this project. In the game, kids can build their town and street, accomplish small quests, and earn virtual currency to buy stuff. I aimed to provide users with an interesting and playable game environment and experience. It allows them to get into the game and characters smoothly. Encourage them to spend more time on this game.

Even though I won't call myself a packaging designer, I often have to help out with my Photoshop skills. Whenever they need a high-quality package mockup for any marketing purpose, they know who to talk to. Here are a few good examples to show you what I mean by "High Quality." Remember, no 3D software was used for any design you see on this site.

Sometimes, photography itself can't present the best of a product. That is why they need someone just like me, a Photoshop freak. I can use Photoshop on almost any design project and surprise you every single time, regardless of whether it's a beautiful product image for the package or for the online marketplace.