OurStories+Final

toc **OurStories** **Final Report** by **Payam Azadi** (azadi@umd.edu), **Brandon Britto** (britto.brandon@gmail.com), **Dan Sonthichartkul** (dsonthic@umd.edu), **Kevin Heiting** (kheiting@terpmail.umd.edu) (final presentation PPT)

=Introduction=

OurStories aims to allow youth around the world to connect to each other in ways currently not available on a large scale. By allowing youth to share stories of their lives on the internet and have these stories presented to youth in other countries, international understanding, acceptance, and unity is encouraged - a sense that is critical in an increasingly violent and divided world littered with misinformation.

Contributors:

 * Kevin Heiting** - Application & database developer
 * Brandon Britto** - Web & graphic developer; HTML and CSS
 * Dan Sonthichartkul -** Testing, JQuery development, interface enhancements
 * Payam Azadi** - Project organization and documentation

OurStories is targeted to youth in any country speaking any language (but preferably can speak English) with internet and social media access.

Related Applications
There are a small number of services available that have similar ideas of story sharing. There are only two services worth mentioning - StoryCorps and OurStory.

The former is a national project with the intention of archiving American history through story interviews that are generally audio and visual. These stories are then cataloged in the Library of Congress and are made available to anyone who wants to listen or view them. This is somewhat related to our idea, however it is specifically for American stories, and with an idea of documenting history. Perhaps this may serve a great purpose in future generations, as sort of a "time capsule" of America through individual voices, but it is possible that the project will serve little or no focus as such information will be forever documented in the internet. Furthermore these stories are specifically voice and video recordings, and therefore their exposure is inherently limited.

The latter, OurStory, has a similar notion to ours (as well as name), but is more of an online journal for people and has social/collaborative elements to it. It is unclear what the value proposition of OurStory is, given the blogosphere and Facebook, both of which already serve these purposes, have infinitely more broad exposure, and much more highly refined interfaces. The OurStory interface is very cryptic and seems to be only partially implemented, and introduces notions such as 'timeline' that neither work nor seem to be good ideas.

=Solution=

The idea behind implementation is to create a navigation system that is quick, intuitive, and engaging - if navigation could be built in such a way, then people submitting great stories and people spending time reading all the stories would almost be guaranteed; if you build it [well], they will come. We wanted to take similar design principles as used by sites like Reddit, Twitter, TextsFromLastNight, and FMyLife. These sites built easy interfaces and put maximum emphasis with 'share this with the world', and they became huge sensations because people wanted to use them and they felt like their voices would be heard.

[[image:1.PNG width="1200" height="653" caption="1"]]


The screen captures shown above may be typical of an involved first-time session of a user with the site. Starting with screen 1, the home page, you are given the most recent and most popular stories to view, trending stories, and navigation areas. From here you can register (taking you to screen 2), sign in on the right corner (not shown), submit your story (screen 3), view your story (screen 4) and finally search for stories (screen 5). Again, order of the images imply the transitions.

Assistance
We decided to leave out any "help features" as we believe that the interface needs no explanation. To submit a story, click submit, to view a random story, click random story, etc. Each of our interface testers of our initial prototype was able to complete task requirements without our assistance, albeit some of the tasks were much more difficult than we had anticipated.

Usability Study
Usability presentation (full usability study details) The usability test was designed to be as simple as possible and many 'special considerations' or testing tactics were purposely not employed. For example, one test subject would be able to see changes made to the system (particularly story submissions) made by other users; independence was not established. This was because the interaction scheme is critical to overall function. Also we did not feel it necessary to monitor or record our subjects in the course of the study, however we did make it clear that we would be asking follow-up questions about their experience using the system. The testing was simply a task list of essential functions, but followed a particular sequence in order to test the quality of navigation. Prior to the test, non-identifying biographical information was collected from each subject. There were five participants, generally college students from different majors, but as well some middle-aged users.

Usability Problems & Addressing
The most common theme was that people had great difficulty finding the 'random story' feature. Oddly, a lonely location at the top of the header seemed to be the last place people ever looked. This user's feelings seems to summarize the general feeling: "Finding a random story was not an easy task. I pretty much clicked on every link on the website, and was disappointed because it appeared that nothing was happening". The other most repeated comment is that there is this ambiguity between the terminology on our task list and that on the website. As predicted, the notion of a specifically named 'advanced search' seems to have caused a lot of confusion ("I find it very weird that there is nothing like "advanced search" on the homepage").

Other points of agreement among all subjects are lack of colors, loudness of story submission form, awkward terminology for form submission buttons, difficulty in finding the 'flag' feature, and ambiguity in purpose among the top header, the left navigation panel, and the footer navigation. To solve this we did some major overhaul with our user interface. Perhaps most notably, we moved the navigation items of "submit a story" and "random story" out of the header and moved them into a prominent area in the left navigation. This is consistent with the expectation of most of our users and therefore seems to be a wise decision. As well, we realized there was no "Home" feature which is a major problem for an interface to not be able to go back to the beginning. Accordingly we made the navigation area on the left to be first, in bright colors, and have an ordering to them - first Home, then Submit a Story, then Search, then Random Story. The idea with Random Story at the end is that people will see the items at the beginning or the end of the list most readily, and therefore for a highly sought after function it makes sense to put it at the bottom of the navigation. Insofar as colors go, we decided to come up with an all-encompassing logo for OurStories featuring the UNICEF logo (the originator of OurStories), and then base a color scheme around that. This has jazzed the site up infinitely from the original prototype and mockup. Even beyond this, we spent a significant amount of time dealing with the CSS to make navigation fit to the screen you're viewing without being too awkward or requiring scrolling or anything. Therefore regardless of your window size and resolution, the content will wrap to your viewing area. This can be demonstrated when you shrink or grow your browser window horizontally. Incidentally, this has allowed for mobile viewing to be more or less seamless without having to build separate CSS for mobile viewers. As for the flagging as inappropriate feature, we changed this to an enormous red flag icon. We believe the size and intensity of the color, despite it still being a 'flag' will be universal to all viewers, and nobody can miss it. The content rating system is also out of 5 stars, matching with the YouTube system, and being universally recognizable. The story submission form has been trimmed to 3 fields: tags, categories, and story-telling area. The registration form has also been divided into "required fields" (username, password, repeat password), and optional fields (age, gender, location). We do this because we feel the easier registration is, the more people will want to register. = = =Open Issues= There are still significant challenges that remain. Perhaps the most notable one is the effectiveness and functionality of the bottom footer. Is it worth it to have at all? If so, how can we make sure that the amount of recent stories fits into the footer given limited space and varying length on story titles? Also, we will have to do continued interface testing, because though users may be able to definitely find the random story and submit story features in the left navigation, this may not be the fastest or best way of doing it for frequent users - perhaps it may be a better idea to keep those navigation items in the header. Additionally, the vast majority of our header area is blank, and it seems as though there must be something useful we can do with this area without clogging up the interface. Perhaps we could have a "featured story" listed in the top with an excerpt an image, and this would change dynamically every time the user loads the page.

Other issues of significant importance for a real launch is content rating and more so content safety, considering most of the users will be youth. This will have to be well thought out and may require some human approval / crowdsourcing to make sure that content is of sufficient quality and friendliness. Permalinks to stories and social media features may also be very desirable and contribute significantly to the success of the site.

The other major issue that we did not address in depth but that we would need to upon launch is content targeting and distribution. To really meet the core idea of this effort, we need to make sure that content is not particularly skewed toward any one country, that stories get a fair chance or are approved/rated for quality, and that people are actually seeing stories internationally rather than stories from countries that are submitting most often. This would introduce nuances in navigation that would have to be addressed, such as having exhausted international stories, people could view just domestic stories, and concerns of that nature.