Switcher Layout is an easy way to implement in-page contents switching; it is being used every where in this website. It provides fast way to switch sections without reloading the page. In my website, you can experience it by pressing left or right arrow key or click on the More and Back button on the top of the pages.

Switcher Layout is created as a by-product of the redesign of my personal website. At first, I was experimenting with different ways to display my contents; in order to make browsing faster, I decided to remove as many page loads as possible. This, however, results in clogging the entire page with information, and I needed a way to separate these contents into different views.

The result is this layout. It consumes everything as "section," allows user to define a default section, and pushes everything aside and hide them. By using one of the loadMore and loadBack functions, it goes through a series of integrity checks and then applies jQuery animate function to dismiss the current section and summon the next section.

This solves the long-page problem by categorizing similar information into their own sections, yet it creates another issue: there is no way in this layout to skip to a certain section without manually clicking on More and Back buttons. I was stunned for a few minutes, yet I suddenly recalled how request parameters are passed using Ajax. Why don't I simply specify section names in the URL, parse it, and recusively call loadMore function?

I attempted the idea, and it was successful since the first implementation (because, to be honest, it was super easy). Currently, user simply specify the key to the section in the URL by adding ?section=[section_name] and the layout will apply loadMore function until the section is displayed.

To talk about this project, I would like to first introduce to you my dear digital point-and-shoot camera. This camera is actually really nice; it shoots static images well and performs excellently at low light situations. Its video recording is also top-tier (of most of the digital cameras I have used), although the sound quality is subpar. I am pretty satisfied with this camera, until I learned that there is no proper way to automatically format the image names except for brute forcing (renaming files one by one).

This is a problem to me. I am (at least I think) a very organized person, physically and virtually. That is, I always keep my files organized with some sort of naming convention then group similar items into one directory. Of course, to rename each file is not a big issue, yet it becomes cumbersome if I happen to go on a trip. Imagine renameing few hundreds (or maybe over a thousand) photos! This is insane!

So, I decided to take a few minutes and compose a shell script that renames each photo into the name I want. This tool has eventually been rewritten into a Java program with graphical user interface and several functionalities. To name a few features:

This project was a requirement of CS 449: Human-Computer Interaction course. Students form in to HCI teams of 3 or 4 and, using Contexual Design, redesign a group of real world professionals' workflows. Our group chose to work on this project with individual financial advisors.

We set up interviews with our subjects and guide them into describing their daily tasks in detail. It was difficult to interview for information because every word we said could affect the direction of the subject's speech. A misuse of phrase may mislead the interviewees, which can confuse them in the end and make them unwilling to provide information.

We carefully conducted all of our interviews and returned to group meetings with extensive data. We analyzed the information and identified the tasks that are better off without technology and eliminated them. We then proceeded to examine the breakdowns within work flows, and discovered that there were several repeated steps in the subjects' current records management methods. We decided to work on solutions that address this issue. After a 3-hour brainstorming session, the white board in our study room was overwhelmed with ideas and features. We trimmed down the set and concluded with an redesigned workflow.

The system incorporates uses of Anoto pen and a digital contents management system designed specifically for the advisors and their tasks. We demonstrated the workflow to our subjects and professor and received positive feedbacks with some criticism. We then reiterated through several other prototypes and eventually resolved majority of the concenrs that the subjects had.

In this webpage, links to our write-ups were provided. Phase 1 includes data analysis from our interviews with the subjects and phase 2 includes proposed work redesigns and low fidelity prototypes. The Final Report was written in standard CHI format and concludes everything with our final design.

A link to the GitHub repository that contains our final working prototype was also provided. You can also download the Java Archive (requires JRE 7 and above). For the purpose of this course, we also prepared a short video summarizing our project; it is available on YouTube, recorded and editted by Marina (Mengqi) Zhao.

As I was doing a side project (a trading card game, now deprecated), I found that in most cases the "card maker" program that I created required several undo and redo actions. It is annoying that, whenever a mistake was made, I had to restart the entire card making process.

I paused the trading card game project and began focusing on an undo and redo module. At first, I thought it could be simply a stack that simply returns the last object in the list, but I soon realized that there were more to it. I needed to take care of type conversion, redo sequences, and several other elements that, without them, the module would not be functional.

I spent more time into researching dynamic typing in Java and other list and abstact functions optimization. I also implemented a few algorithms that could increase object retrieval and memory management. Many things were done in order to make the module easily integrated into other systems, and I was thrilled when I finally finished the framework. In addition to core operations, I also provided a custom Java Swing object, hList, that displays a list of operations pushed to stack when triggered.

Everything was good, until I found out that Java actually had its own built-in undo and redo library. I felt devastated when I realized that because I spent weeks working on this module. Although it was depressing, I still felt that the experience I obtained through the intense programming was invaluable.