This is a list of my projects in detailed view sorted by Time frame in a descending order:

PHP/MySQL

Course: SI 572 (Database Application Design)

Demo site: http://yuliang.net/ADHD info
(All data is fake, NOT real patient information.)

Collaborators: Me + 3 talented peers

Summary: Created a web database application that allows client to view, edit or delete patient information. Supports sorting, autocomplete and date picker.

What I did: I met with the client, participated in team meetings and contributed in 90% of the database design and coding tasks.

Database Schema:

Presentation slides:


  Technology used:

Drupal-Logo

Course: SI634 & SI635:

These courses are about configuring and customizing Content Management Platforms. We focused on Drupal 6 but also covered other platforms such as Wordpress, Joomla, phpBB, etc.

What is Drupal?:

"Drupal is a free and open source content management system (CMS) written in PHP and distributed under the GNU General Public License. It is used as a back-end system for over 1% of all websites worldwide ranging from personal blogs to corporate, political, and government sites." - Wikipedia

Result:

By using the skills I learned in these courses, I rebuilt my personal website (yuliang.net) in Drupal.

CONFIGURATION:

Modules (List of main modules I used in additional to Drupal core modules): 
Content type & Taxonomy:

I created a new content type called "Project" and a new Taxonomy called "Technology". Under "Project" I created fields like "Time frame", "Brief description", "Full description" and file field "Pics" for displaying images. Under "Technology" I created terms like "iPhone programming", "AJAX", "Java", etc. By associating "Technology" with "Project" I can then select what type of technology I used for a particular project. 

Views:

Views are powerful for extrating information from different content types and put them in a single page. I used views for the following pages:

  • http://yuliang.net/projects: The output of this view is a table. It feeds the table with fields "Attached images", "Title", "Time frame", "Technology terms" and "Brief description" from all published "Project" pages.
     
  • http://yuliang.net/project-list: The output of this view is an unformatted list. It feeds the list with page content from all "Project" pages. In technical words, it shows a list of teaser view from all published node with type “Project”.
     
  • http://yuliang.net/project-slideshow: This view creates the slideshow window at the bottom part of my first page: yuliang.net/home. The output of this view is a jCarousel window. It feeds the window with images of type “Pic” associated with published “Project” pages and title of the corresponding page. The title links to the project page and the image is lightbox style.
     

CUSTOMIZATION:

I wrote a module to add twitter & facebook like buttons on top of a blog post and a "Return to top" link at the bottom of a blog post (see an example).

 

This is the code for that:

<?php
function yuliang_nodeapi(&$node, $op, $a3 = NULL, $a4 = NULL) {
    if (
$op == 'view') {       
           
        if (
$node->type == 'blog' && $node->status ==1) {
           
$node->content[body]['#value'] = yuliang_add_facebook($someURL).$node->content[body]['#value'];
           
$node->content[body]['#value'] = yuliang_add_twitter().$node->content[body]['#value'];
           
$node->content[body]['#value'] .= yuliang_add_returntotop();
        }
    }
}


function
yuliang_add_facebook($someURL) {
   
$out = '<iframe src="http://www.facebook.com/plugins/like.php?href='.yuliang_return_url().'&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>';   
    return
$out;
}

function
yuliang_add_twitter() {
   
$out = '<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>';
    return
$out;
}

function
yuliang_return_url(){
   
$path = isset($_GET['q']) ? $_GET['q'] : '<front>';
   
$myURL = url($path, array('absolute' => TRUE));
    return
$myURL;
}

function
yuliang_add_returntotop(){
   
$out = '<div style="float: right;"><h4><a href="#top">Return to top &uarr;</a></h4></div>';
    return
$out;
}
?>


UM Clinical Trials App Icon

Course: SI 682 (Interface and Interaction Design)

This course "provides an introduction to user-interface design from a design principles perspective. It covers such topics as accessibility, design ethics, psychological principles, interaction principles, requirements analysis, project management, I/O devices, standards and style guides, and visual design principles.
This is a projects-based course. All projects are scoped to allow students to develop and apply a pragmatic, applied view of design, with frequent practical design exercises".

Project site: https://sites.google.com/site/si682clinical/

The Client:

Our client is the Michigan Institute of Clinical and Health Research, specifically their online clinical trial registry, UMClinicalStudies.org. This website displays information about studies taking place at the University of Michigan that are in need of participants and provides a system for signing up as a volunteer.

The Problem:

Many clinical trials that are held at the University of Michigan are not completed due to lack of participation. As a large research institution, UM would benefit from greater trial participation. While UMClinicalStudies.org provides the means for people to find studies that match their conditions and preferences, MICHR believes they can improve the service, increase interest in clinical trials, and reach a wider audience.

Our Goals:

We aim to create an interface that will:

  • increase clinical trial awareness and participation at the University of Michigan,
  • connect with students,
  • be simple and convenient,
  • engage users,
  • and facilitate trust in research.

Our Concerns:

  • Awareness: Some people are not quite sure what clinical trials are. Others are familiar with them but have never participated. Still more people may be interested in clinical research but never have heard about MICHR's website, UMClinicalStudies.org. But as Professor McQuaid pointed out, most people in the University community encounter advertisement for so many different organizations and events on a daily basis that they may not take notice of any of it. How can we promote the interface that we will create for them?
  • Motivation: As with anything that requires volunteers, motivation is a big issue for this project. Although many studies offer incentives, not all of them do, and not everyone can be motivated by cash, gift cards, or free teeth cleanings. What can the application do to motivate users to actually participate?
  • Loss of interest: Similarly, how can we keep people engaged? Our client informed us that they have found a lot of people register as volunteers and then completely forget about it or never follow through with a study.
  • Ease of use: After going through the registration process on UMClinicalStudies.org and browsing some studies, we wonder how the system could be adapted to a mobile application. How can we streamline and simplify what the website offers, while also incorporating something new that keeps users interested.

Our Ideas:

To help MICHR improve recruitment for clinical trials we plan to design a mobile application that will make it easy for students and other members of the community to access information about trials. The mobile application would communicate information to potential participants, provide a map of clinical trials, send alerts about new trials, and connect participants with researchers.

In order to truly engage users and create an interest in the project, though, we think we need to go beyond the basic requirements of the system and find ways to make volunteering fun, interesting, and social. We are going to consider how to use things like points or ranking systems, and sharing to create an application that people will want to use.

What I did:

As a team member, I participated in interviews, contextual inquiry, affinity diagramming, writing, presenting, Lo-Fi and Hi-Fi prototyping. I also contributed to 90% of the coding of our app.

Steps & Progress:

  1. The team
  2. Contextual Inquiry
  3. Personas & Scenarios
  4. Lo-Fi Prototype
  5. Hi-Fi Prototype
  6. User testing & Summary

Screenshots:


Simple Looper Icon

Being also a pianist, I have always been trying to combine music with technology. With my iPhone programming knowledge, I created an app called "Simple Looper". This app lets a user to easily select a portion from a piece of music and repeats the portion over and over again. The time from having this idea to submitting it to the Apple App Store was ten days and I have received over six hundred downloads and positive reviews since then. The experience with "Simple Looper" encouraged me to think about and develop more music related apps.

View more on Apple's iTunes App Store:


MiMI logo

The Client:

What I did:

  1. Performed clean-up of site http://mimi.ncibi.org by getting rid of
    redundant jsp, html and css files and also redundant code in css. Wrote a perl
    script to make a file linking network.

  2. Wrote java interface files for display table tags. Used eclipse, tomcat and
    svn to make changes, deploy and update the site.
  3. Made mobile version of MimiWeb. URL: http://mimitest.ncibi.org/mobile/
  4. Building iPhone application for MimiWeb (in progress).

 

Mobile web app (embeded in iPhone frame, try it!) and Screenshots of the iPhone app:

 


DTEEnergy

Course: SI 622 (Evaluation of Systems and Services)

The client: DTE Energy is a Detroit-based utility company that serves electric and gas for millions of customers in Michigan.

Collaborators: Me + 3 talented peers

Summary: To be filled in...

What I did: I participated in team meetings, interviewing, making survey and graphics, writing and formatting reports.

Documents:


last.fm_logo

Course: SI 601 (Data Manipulation)

Project site: http://yuliang.net/cgi-bin/lastfmlab.cgi

Collaborators: Me + 2 talented peers

Summary: This project is about using Perl and Last.fm API to do some interesting exploration of the tags on the popular social music network, Last.fm. We created a tag explorer by artist that analyzes/compares tags associated with the music of the artist with tags associated with music of similar artists (neighbors). Often times this will reveal some weird or missing tags of the artist, and can get quite amusing.

What I did: I participated in team meetings to discuss what we wanted to accomplish and I contributed in writing different parts of the scripts.

Presentation slides:

 
 
Try out the script below or go to the script page:


  Technology used:

Otterbase

Course: SI 501 (Contextual Inquiry and Project Management)

The client: Otterbase, Inc. is a supplemental staffing company that provides clients with long-term or short-term temporary employees, or candidates for permanent positions and prides itself on providing quality service and candidates to their clients. Otterbase has two offices in Michigan, in Livonia (Detroit Metro) and Grand Rapids, as well as a number of smaller offices out of state.

Collaborators: Me + 3 talented peers

Summary: Our team was asked to analyze the recruiting process in Otterbase's Detroit Metro and Grand Rapid offices, with the aim of increasing efficiency. We interviewed five employees at the Detroit Metro office and two at the Grand Rapids offices. After completing the interviews, we identified four main areas of focus: Account Manager–Recruiter communication, Requirement Assignment, Recruiter collaboration, and Usage of the database program AKKEN. We designed recommendations that we hope will address current issues in these areas and promote efficiency. To help guide our recommendations, we constructed models showing the sequence of steps each interviewee used to complete their tasks, the flow of communication between the interviewees and others involved in the recruiting process, and other factors that influenced the process, such as physical layout and constraints, and attitudes about the process and co-workers.

What I did: I participated in team meetings, interviewing employees, making and sorting affinity notes, creating affinity diagram, constructing models and presenting to classmates and clients.

Presentation slides:

Documents:


Sequence alignment

OBJECTIVE: Given two DNA files, one (view file) contains 100,000 short sequence reads (30~50bp) from a single anonymous donor, the other (view file) has a template DNA sequence for human chromosome 13. Identify the best match along chromosome 13 for each short read sequence.

STRATEGY:

Summary: Double hashing. List all occurrences of each 13-letter word for chrom13 sequence. Process one short sequence at a time using hash search and smith waterman alignment algorithm.

Detailed explanation:

1. Initialization and indexing. Count number of characters in chrom13 file using charCount. Determine a good hash table size using hashCal. For chrom13, the two numbers are 114,142,980 and 201,326,611, respectively. Create and initialize four arrays (these count for most of the memory usage):

 

char charTable[num of chars for chrom13]

int intTable[num of chars for chrom13]

int hashTable[hash table size]

int locTable[hash table size]

 

charTable stores each character in the DNA sequence in uppercase. Each character is converted to a small number using encode and stored in intTable. Calculate hash value for each 13-letter word using hashFunc and insert into hashTable using insert. When a value is inserted, location of the first character in charTable is inserted into locTable. A maximum of 50 (COLLISION_THRESHOLD) collisions is allowed if repeat value occurs.

2. Short sequence searching. Create and initialize three arrays:

char estName[MAX_EST_NAME_LENGTH] // store the name of the EST

char *estCharTable = new char[MAX_EST_LENGTH] // store forward EST sequence

char *rc_estCharTable = new char[MAX_EST_LENGTH] // store reverse complement EST sequence

 

Go through the short sequence file and count the number of short sequences using estCount. Both forward and reverse complement short sequences will be examined.

EST searching and imperfect matches handling:

First search 1~13 characters in forward and reverse complement direction, if found then perform smith-waterman local pairwise alignment between short sequence and its corresponding chrom13 sequence, if percentage of matches is bigger than 95 (MATCH_PERCENT_THRESHOLD) and gap number is smaller than 3 (GAP_NUM_THRESHOLD) then this counts for a ‘found’ or ‘mapped’, then alignment and mapped location are printed out. When printing, reverse complement sequence is indicated as “*rc_EST”. Mismatches are in lower case. hashSearch also handles repeats under COLLISION_THRESHOLD.

If first attempt failed, proceed with 2~14 characters and 3~15, 4~16… until found. If not found then just print out short sequence name and length.

code snippets1

 

*3. Calculate and display top repeats. This function (and four other auxiliary functions) is for calculating top repeats by double hashing for displaying some statistics of genome information. The number of repeats is defined by REPEATNUM.

However, the top repeats information is independent and not implemented in indexing or short sequence finding.

Top repeats

RESULT:

Output files (reads1000.txt), (reads100000.txt) and code (sequence.cpp) are available at http://www-personal.umich.edu/~yuliang/biostat615/ .

check function evaluation times (number of probes) : 1,936,052,712. Indexing time is 156.46 seconds (CPU: 2.4G Intel Core 2, RAM: 4GB 1067 MHz DDR3).

96% short sequences are found and mapped to at least one location. 35,000 short sequence reads per minute are processed on average.

Drawbacks and further improvements:

  1. Computationally expensive. Needs about 2GB of memory.
  2. Does not “learn” from the template file. Can calculate top “repeat words” but does not implement that information.
  3. Missed some short sequence reads. Possibly because of setting a collision threshold (COLLISION_THRESHOLD).
  4. Only tracks a maximum of 100 (2*COLLISION_THRESHOLD) repeats for each short sequence. Also due to collision threshold.
  5. Short sequence mapping efficiency is low (35,000 reads/min).

Sample output:

  1. Perfect matches (forward and reverse complement at two locations)

  1. Imperfect matches (with gaps and mismatch)

 

List of functions:

code snippets2

 

 

 


  Technology used: