Final Presentation
Here is our final presentation and video sketch describing metaStar.
Download our final presentation
Video Sketch:
Video Sketch
As we near the end of the project, we just wanted to give a little insight into one of the final stages of production for our project: the video sketch. The video sketch will be part of our final presentation and will illustrate a few short scenarios of use of the metaStar system.
We decided to tell our story from the point of view of Chun Hei, our persona. We feel that this gives the video a strong personal aesthetic. We developed a script that has Chun telling her story from a first-person perspective. The video sketch will also show detailed interactions of our system; how the user actually builds their star, explores the universe, and participates in forums. We went through a long process of recording voice audio, deciding on the visual style of the video, mocking up the interface to show the interactions, and finally cutting it all together into a cohesive whole.
In order to avoid spoiling the surprise for the final presentation, no preview of the video sketch will be offered here. But our final presentation with the completed video sketch will be posted soon.
Wireframing
Download inyourface_wireframes
Through multiple iterations, we developed wireframes that step through features of the information architecture of most use to our persona – creating a star, filtering through other stars, and joining a forum. We focused on unique forms of interaction including an strong micro/macro relationship in navigating the whole of the system and drag & drop media.
myStar (Identity Map)
Based on the information architecture, wireframes and evaluative research conducted, we discussed as a team about the visualization for our online product. We focused on major three questions below.
- How can we effectively create the identity map, networking and forum view on the screen?
- How can the identity map, networking and forum visually be represented in a cohesive manner?
- What kind of look and feel teens like?
With these three questions in mind, we came considered many ideas for the visualization such as building a virtual city, virtual gardening, stars in universe and etc. All of the ideas were the metaphors where students can build there own identity map (buildings, gardens, stars) as well as something with other students (a city, a town, a constellation). After a lengthy talk, we concluded that the universe metaphor was the most appropriate visualization because building a star visually matches with the bull’s eye format for the identity map in the generative research. On top of that, the universe matched up with the ideas that you (a star) are with other people (other stars) in the same space (universe), building constellations with stars whose interests and backgrounds are closer to yours. There are three parts in the metaphor, stars, universe and nebulas: stars where individual immigrant students can provide personal profile information and build their own identity map with various media and stories: universe where students can navigate other stars and forums and be matched with those after using the filter: nebulas for interest-based social forum where students can interact with other students with topics of interests within a theme and organize physical meet-ups.
The identity map was reborn as myStar. We went through a number of iterations of styles for myStar, considering aspects of look & feel, in addition to interactions:
Here, we will first walk you through the (almost) final “myStar” view. After providing the basic profile information such as age, a country of origin, family tree, and a school the you’re attending, you can start building a myStar. The star is divided by cultural transition period, in this case Korea from age 0 to 9, California from age 9 to 12, and Ohio from 12 to 14.
Then you can drag either system-generated photos or your own media, or add words in the panel on the right. Simply drag and drop the media in the space where you think is relevant to a particular cultural transition period and the media will automatically attach to the identity map. Then comes a pop-up box beside the media where you can enter your story relate to it, rate a significance for your identity and tag any related words. Hit publish and you’re ready to go to the next step.
You can repeat this process to build your star with as many media as possible. Here, the proportion of the cultural transition period in the circle changes as you attach the media to the map based on the numbers of media in a particular space. And the size of the media is based on the rate of significance. At the core of the circle, there comes a word cloud, the words most frequently came out as tags of the media. This word cloud will help easily identify your interests at a first glance.
As you attach more and more media to your star, it becomes more crowed. Hence, there is a limit in numbers of media which you can attach to the star as a representative one. As it gets over a certain number, the medium will be placed in the map, yet cannot be seen at a default view. When you hit the plus button beside the time bar, it will show all the media you’ve attached to the map and simply hit the minus button to hide the media except the representative ones.
Lo-fi Prototyping
Last week, In Your Face conducted lo-fidelity paper prototyping tasks in CMU’s usability lab, testing the basic usability and usefulness of the system.
What we learned:
- While participants generally understood the universe metaphor, there were some points of confusion, especially around the idea of highlighting other stars in the universe that fit certain criteria. Instead of highlighting stars in the universe view, we decided to make filtering more explicit as a way of finding types of people in our system. By using a filter menu, users can simply see all users or forums that match their filter. More generally however, we started to realize that the interactions we are planning to make with metaStar are unconventional, so a certain amount of learning will need to occur for the user. We hope to make the system clear enough to facilitate a easy learning curve.
- There was some confusion around adding entries to the identity map. This was perhaps because there were many things to enter for each entry, including significance of the entry, time period related to the entry, and location on the map. We will strive to simplify the process of creating the identity map overall.
- The idea of collaborations between people around topics of discussion made sense to participants, but the interface we had created for it was awkward. We decided to make the navigation of collaborations more conventional with a list of comments for each topic of discussion, rather than a sort of constellation metaphor. We also decided that collaboration wasn’t the right word to describe the activity and went instead with the more conventional term of forum. One participant gave us the idea of a sort of sharing circle, where each participant would have a turn to contribute a featured topic of discussion in the forum. We decided to incorporate this idea into how our forums work.
- In general, we got confirmation that this sort of service would be useful for new young immigrants for making connections with new people.
Refining our Service Provider Model
We received valuable feedback during our April 12th presentation regarding the viability of our system operating under the framework of public school systems. We all know educational infrastructures are under great demands. The likelihood that a school or school system could invest in bulk licensing for metaStar was slimmer than we wanted to admit.
Our previous model, based on Educational subscription model, looked like this:
We needed to rethink our model, but we were certain of a few key principles: the service should be free to users, and while it identity issues plague most teenagers, our target audience remained recent, young immigrants.
Furthermore, identity is a complex, emotional topic. We asked ourselves: are advertisements appropriate in this emotional “space”?
Our first solution involved creating a revenue source that could exist quietly and harmoniously within the system. We came up with a three-layer advertising structure that would accommodate different levels and types of sponsors: well-known corporate brands, small business owners, national companies, and local vendors.
metaStar revenue sources
- Branded Image Banks: National corporate sponsors (e.g. Nike, etc.) provide metaStar with a bank of their images (brands or related lifestyle shots) that can be used within the users’ identity maps.
- Smart Text Ads: Sponsors pay us for text only ad space, but ad is only displayed when system scans and recognizes relevance to the user. Relevance is based on comments/tags that the user has made. Ads function more like recommendation, and pop up on identity map page occasionally.
- Sponsored Forums: Local vendors buy a space on a forum, creating incentive for young people to gather outside of the virtual forum and into the physical world, based on their shared interests .

This seemed to address the issue of funding pretty well, and felt like a reasonable compromise of creating opportunities for sponsorship without overpowering the site with banner ads and pop-ups.
However, as sponsors had mentioned in the past, our instructors again brought up the fact that our service was feeling like it could belong in the government and social services market, based on the target audience. Some also felt strongly that the incorporation of advertisements was simply not a good idea, given the subject matter.
In response, we’ve adjusted our service provider model to fit nicely in an arm of the immigration department of the U.S. government. In this model, metaStar provides the service, but the government hosts the system within an existing departmental website and purchases renewable licenses to support user interest. Entities that are also interested in improving multicultural teen identity (e.g. schools, cultural centers, etc.) can also purchase subscriptions to metaStar.


















