UX Designer
Bubble Development, Graphic Design, Saas Product Design
Why jump out of the box, when you can make a spaceship out of it.
Living the "Cyborg" Era: Chatbot Experience Design
Uphold influencer marketing with conversational user interface
At Octaive, we design and deliver conversation Ad for clients from different industries. We believe in precise marketing and customized experience.
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Allow user to manage large amount of sites by template-in-use
Every site has multiple versions; every version has multiple pages. We need an easy-to-understand interface to help user navigate.
Add a variable feature. In short, user can create and reuse variable in different sites
Allow user to manage large amount of sites by template-in-use
Make Site Update Easy and Trackable
We expanded a simple html uploader into a management app
Our client needs a platform to central-manage 225 landing pages of its gym studios across the country. We designed a low-cost solution using Bubble.is based on object IDs in the database.
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Redefine necessary task type and KPI; redesign app interface for the one-interface-multiple-user situation
Data flows behind interfaces decides the ultimate UX
Our software carries with it management solutions based on current business model. This graph shows our efforts in tagging client for auto-marketing.
Redefine necessary task type and KPI; redesign app interface for the one-interface-multiple-user situation
CRM System for Kickboxing Franchise
Organize User Stories into New Modules and Redesign Data Structure
Our client was using a standardized CRM system that has features but neither good experience nor reliable automation. We re-organized user story into modules and rebuilt user flows. This project also gives a perspective into the relation between data structure and user experience as we design register and payment flows.
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Animation window + course gallery
Persona and conversational tone
Display only necessary content
Animation window + course gallery
To The Web
First Web-based Authoring System for E-learning
This project marks our team’s effort to bring the interactive course development experience to the web. We are combining the rather traditional developing process of timeline-based interactive content with web features such as cloud storage of data and real-time collaboration.
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Display large amount of real-time data
Display large amount of real-time data
Fire Fighter Project:
Heart Rate Management Portal
FireBeats is the heart rate data management system our team develop for NYFD. Given the large amount of real-time data, the challenge lies in how to allow clear comparison and navigation
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Document management in web app
The media gallery
Optimize and simplify existing features into a better design
Document management in web app
Design the Authoring Experience:
What Should Instructors see?
These slides depict what we envision the instructors who are using our platform to build courses will see upon bouncing from our landing page. I decided to place document management tab before anything else...
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Query Portal Design:
What is the best layout?
Jakob Nielsen used to say:“pay attention to what users do, not what they say.” Our user gave us very specific requirement on how should we present information. But actually, it is us designer's job to study the "what" behind the suggested "how" first...
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
This is the second part of our analysis paper on career planning stress, explaining our design modules and rationale.
Play with Icon
Beyond Graphic Design
Icons need to go beyond looking good to become a “storyteller”. This icon set is used in the interface of an editing platform. They are juxtaposed with text to help user visualize the feature they are choosing.