Rosalie Chan data, writing, UX

Apps & Design


StoryLineJS is a storytelling line chart tool that I worked on for the Knight Lab. I started working on the development of this tool in spring 2016.

To start off, I conducted research on existing charting tools and stories that use line charts. Next, I worked on sketching and prototyping how the tool would look and work. I created paper prototypes and iteratively tested them. Finally, I worked on a web prototype using HTML, CSS, JavaScript and d3.js.

The beta version of StorylineJS was recently released.


For my Software Project Management and Development class, I worked on eRetirements with a group for a client. Our client requested that we redesign the interface of the questionnaire of eRetirements, a website that recommends to users places to retire.

We designed the interface so that the questionnaire would feel more personalized, as users can rate how important a category is to them when considering where to retire. Furthermore, users can take answer questions in any order they wnt, and they can go back to previous questions, as answers are saved. In order to appeal to middle-aged and elderly users, we worked on implementing an easy-to-use, user-friendly questionnaire.

For this project, we used HTML, CSS and JavaScript. Check it out here.


For my Software Project Management and Development class, I worked on GeoVibes with a group. We came up with the idea for this iOS app ourselves. The idea behind this app is, you can search a place, and this app will tell you where it is and what the "vibe" there currently is by giving you a positivity rating. For example, Disney World always has a really positive vibe.

For this project, we used AppGyver, the Google Maps API, the Twitter API and a sentiment analysis API. The app comes up with a positivity rating based on tweets about the searched location.

Women In Computing Website

Currently, I serve as the public relations co-chair and the webmaster of Women In Computing (WiC), a student group for Northwestern students who identify as a woman and who are interested in computer science. As webmaster, I manage the website, and over the summer, I redesigned it.

In redesigning WiC's website, I used the concepts of material design and parallax design. I also worked on making the website mobile-friendly. I used trianglify.js for the website's background.

If there are issues or design suggestions for the website, please email me.


In February 2016, I attended HackIllinois, a hackathon hosted by the University of Illinois Urbana-Champaign. My group created Rude!, an Android app that encourages you to spend quality time with your friends, rather than your phone.

To use this app, when you're with friends, you can switch your phone to "social mode." You earn points for not touching your phone during the time you spend with friends, but if you touch your phone, you lose points, and your phone will give you a sassy message. If you touch your phone three times, an embarassing Facebook status will be posted on your wall.

We used Android Studio to develop this app. Ideally, the points would be used to redeem coupons and offers at local businesses.


When I served as Interactive Editor of North by Northwestern, I led a small team in the development of "Submerged," a multimedia project that showed photography and footage of Northwestern's aquatic sports. North by Northwestern obtained an underwater GoPro for this project, which was made possible by the Crepe Bistro Memorial Fund founded by North by Northwestern alumni.

Check out the story here.

Graduated and Homeless

When I served as Interactive Editor of North by Northwestern, I led the development of "Graduated and Homeless," a multimedia story about a homeless Northwestern alumnus.

The story is told using photos, audio recordings and an NPR visuals template, which is open-sourced. After this story's publication, it became a huge hit and was shared by many Northwestern students and staff on social media.

Check out the story here.

North by Northwestern Magazine

In spring 2015, I worked as a digital producer for North by Northwestern's quarterly magazine. In developing the presentation of these stories, we used HTML, CSS, JavaScript and a Ruby template generator. Below are the links to stories I designed and developed.

The Long Road to March Madness

A Long-Distance Harmony

Show Me Your Jugs

Divided Discourse

Mad Libs Northwestern Edition

During the quarter I served as Interactive Editor of North by Northwestern, the Interactive section started a weekly Northwestern-themed mad libs. I taught my staffers how to code in HTML, CSS and JavaScript to generate mad libs games and stories.

Check out one example here.

Wiki Studio

In spring 2015, I took a course called Innovation in Journalism and Technology. I developed Wiki Studio with three other students. Wiki Studio is a video crowdsourcing website that allows people to upload video clips to a movie that has many contributors, similar to Star Wars Uncut.

In creating this app, we sketched and created paper prototypes, and we iteratively designed the prototype based on user tests. We developed this app using HTML, CSS, JavaScript and Ruby on Rails. You can read more about Wiki Studio in my Medium post.

Mochi's 25 Hottest Asian American Men Worth Watching

From January 2015 to April 2016, I served as the Web Editor of Mochi Magazine, an online magazine for young Asian American women. As Web Editor, I created interactive stories.

In Mochi's Summer 2015, Mochi put together a feature on the 25 hottest Asian American men worth watching. These included musicians, designers, models, athletes, politicians, actors and entrepreneurs.

I used HTML, CSS and JavaScript to develop this project. Check out the story here.