volcano lights

Millie Lin

Design with code

Work

I do the job that convert the user interface from implementation mental to user mental for web and mobile app. Below are the main projects that I contributed and experimental projects that I played with.


2016

Podcastis

Podcastis

Concept design and development of the collection of independent Chinese technology podcasts. Responsive layout. Developed in AngularJS.

2015

PixelShank App

PixelShank

PixelShank is an cross-platform app that support to click and measure the width and height of any object on an image and save it as a .png file. It works well in the modern web browser while you can run it as a desktop app on windows, Mac OS or Linux.


蜜途 Sweet Path App

蜜途SweetPath App

A little app that helps people to find the place to buy the top skincare brands products in Hong Kong. I made this idea and designed the icon and the workflow. Developed by Leo Lin. 和朋友闲时做的一款迷你App,香港一线主流美妆品牌的专柜地址电话,方便在香港有目的性的购买品牌护肤品的人群。也方便国内的游客或帮忙代购的人快速找到目标专柜。目前的功能比较简单,会显示临近的地铁站及使用Apple自带的地图。

去App Store下載蜜途

UX Guideline

NetDimensions Talent Suite

Since June 2012, I worked as a full time UX/UI designer and was in charge of the UI design and redesign work for NetDiemsnions core product Talent Suite.

To make this enterprise talent management system more easier to use, I worked to define the Usability Guideline to simplifiy this product who was 14 years old in 2013.

For new feature requirement, I dealed with the prototype and mockups and provided the html prototype and to ensure css ready for development.

Also needed to solve the meet the standard of W3C accessibility, and to define the usability guideline to make the UI elements work consistent in this huge system.

Redesigned Login View


Elements Board Game

五行纸牌桌游 Elements Board Game

It is a board game I designed that inspired by the Chinese elements relationship map "Wu Xin"(五行图). I use pen and paper to do the mock up and explore game rules with colleagues and friends. After a simple rule shaped, I started the graphics design on the card image and the map. Feel so good when we have the printed cards in hand and have people together to enjoy the game.


2014

News Community Prototype in AngularJS

News Community HTML Prototyping in AngularJS

Web Product News Community ( Chinese, Concept Prototype )

In the west, there are several web community such as Product hunt, hackerNews, designerNews that bring me valuable stuff that worth to catch up everyday. Though there are tens of thousands of technology websites in mainland China, most of them contains too much information that need me to figure out the valuable news myself.

Sometimes, I thought it is enough that the Chinese could visit the website in the west as well. However, when I heard that website like TheNextWeb is not available to visit in the mainland,a web trends digging community in Chinese may be necessary.

I am not sure how far will this idea goes. The concept is what can be seen as the prototype.

Prototype was built with Foundation, angularJS, bower, grunt, scss and WebStorm.


Netdicons

Netdicon icon-font Design

To make the icon more flexible, I redesigned all the course type icons in Illustrator and generated them into icon-font in fontCustom command line. In this way, it is able to resize or coloring the icons in CSS and make them easier to be changed in the skin. The vector shape also make it looks perfect on devices with retina display.


Baidu Text input skin: Magic Pocket

Lucky Draw

A simple machine that uses to draw for a prize.

The different part of this machine is that it support viewing the results on multiple machine at the same time. One of the application scenarios is to use for engineers team. It help engineer draw to randomly assign the tasks in a fair way. All the engineers no need to go to the meeting room to get the result. Sitting on the desk, you can control and monitor the process and get the result.It also supports control and real-time monitor through the mobile browser.

In this project, I designed the application working process and the user interface, conducted with the front-end development. It was made during Chirsmas season, so I chose to wear it with the red and green skin.

The backend is developed by another programmer in Node.js and socket.io.


FastFresh Site Design

Site Design: FastFresh

E-commerce website design for FastFresh.

In the year 2014, I was in charge of both the UI design and front-end development to design and build up this website by using GumbyFramework.

Remotely collaborated with the other web developer to make the thing work with the support of DjangoCMS and its e-commerce package.

This site had gone offline because of the business.


Text Image Generator

Text Image Generator

An online image generator made with HTML5 Canvas Text API


Code Review Board

Code Review Board

Real-time code review kanban board for engineering team. Built with AngularJS and Firebase.


2013

Baidu Text input skin: Magic Pocket

Magic Pocket 口袋密符输入法皮肤

Skin Design for Baidu Mac Input. The inspiration is from a T-shirt with pocket on a magazine. Visit Website

这是2013百度输入法皮肤大赛的参赛作品,灵感来源于杂志上的一件带口袋的T恤。 如果你正在使用百度拼音输入法For Mac,可以到官网免费下载使用


6 Online Mobile App Mockups

Before 2012, I worked for two mobile startups and figured out 5+ several concept mobile app UI&UX design. You can visit the links below on either your mobile devices or the desktop to experience.

More

For more work on or before 2012, please visit My Portfolio 2012 .


More Design and Illustration work