99° Press ’17 Graduation Checklist
Graduation is drawing near as June approaches. Whether you’re about to graduate or not, there’s definitely a graduation checklist for you, writing down all the things you long to do in college times.
99° Press has sorted a graduation list tailored for Fudan students as this is the first web app presented by 99° Press. You may take a rewind of your memories here, or complete the unchecked listings. You can simply type in your name and unlock your graduation achievement.
UI design
Simplified and Streamlined
The philosophy of the Checklist’s UI design is all about simplicity. We put the most important and the only entry for users – name input – straight forward so the interface is pretty easy to use.
Animation
Delight in Details
We put a great attention to transitions and animations. Every button and input has a hover state so users will have awareness of their interaction with well-crafted smooth animations. We implemented drop shadow and linear gradient so the interface looks sleek, modern and beautiful. We believe these animations will bring delight to users as they play around the app.
Achievement
Pretty Serious, Actually
Our editors made up the achievements in the form of traditional Chinese idioms (Cheng-yu). We used Kaiti (楷体) typeface (basically equal to handwritten cursive font for Latin letters) and Tianzige (田字格) which is pretty common in traditional Chinese printings and especially in early school textbooks. With Kaiti, we expect users to treat these graduation achievements seriously like they’re reading something on a real book.
Since Kaiti is only available on a few desktop computers and Chinese web fonts are mostly pretty big and slow to load, we choose the SVG solution to ensure the page look the same on all platforms.
Behind the scenes
Vector Everywhere
In the development phase, we take the all-vector solution. All the assets in the web app are SVG or styled by CSS and not a single bitmap image is included. Even the “unlock” animation is written in SVG animation instead of a GIF. This ensures the best display quality on every device and it decreases the file size dramatically.
Checklist now available
Unlock your achievement.
The Checklist went viral in Fudan campus and WeChat Moments since its release. Over 3.1K users used the app within a day and over 7.6K achievements are unlocked. It sets a new model for new media communications in Fudan University.
