The roots of OpenProcessing is linked to my thesis project at ITP, NYU. When I developed OpenVisuals, open source visualization framework, it allowed Processing users to easily upload and share their sketches that have visualization focus. In its beta stage, I realized a strong need for ‘flickr’ish place in the Processing community, and OpenVisuals was technically supporting such a structure within its functionality.

Design Process

So, I took OpenVisuals as a template, but took the data visualization concept out. I did couple of user testings to see if it serves well for the group of Processing enthusiasts, and defined my production strategy to enable this tool for the community first, and design further solutions incrementally following the user feedback and observing user behavior.

At the first phase, having set the first priority to providing this sharing tool with its adequate functionality, I kept things minimal: By the time of the launch, website included only 4 sections (homepage, browse, visual page, register/upload), and 1 image (for the homepage). After testing the functionality with couple of recruited users, the number of hits made its first spike when Daniel Shiffman blogged the project on his website.

Since then, the design of the website had been continously improved and updated by observing the user behavior through analytics, feedback and overall website usage.

Recently

Through 2+ years since it’s been live, OpenProcessing.org became the second most-visited site of resource for Processing community, following Processing.org. It became a great library of amazing sketches, source code and communication within the community. With its increasing traffic, the site is currently serving more than 2000 visitors a day, accounting for half a million pageviews a month. It had been named and linked by thousands of websites, including Wired.com.

Read what Bruce Sterling says about OpenProcessing here, here and here.

The Killer Feature: Classrooms

I will soon update here with some info.

Afterthoughts

Since then, OpenProcessing had one major redesign, and additional functionalities such as comments, source code view, rss feeds, tags and tag subscriptions, user profiles. In the long run, I am exploring the options to make OpenProcessing more functional for teaching purposes: Processing is used in many platforms to teach programming within visual context, visualization, dfx, etc… OpenProcessing can be a great tool to gather students together to improve their learning experience and collaboration.

Having raised a lot of attention in the recent years, data visualization proved itself to be an important subject to provide better understanding of data and information which cover a wide spectrum from data-intense scientific researches to election results. Most of the times, and except pie charts and bar graphs, good data visualizations are designed and tailored for a specific data set, and are not necessarily available publicly to be used with different data sets. This limits the potential of visualizations to be used in different purposes.

A simple user scenerio is:

>> A person interested in visualizing a data uploads the data set to the website. She browses the website and picks a visualization to visualize his/her data. In the meantime, She allows her data set to be used by anyone under Creative Commons License.

>> A visualization artist finds this data very interesting. He copy/pastes the given piece of library code to Processing and starts building his own visualization using that data set. The library allows him to access the data set that is in the cloud. Once he is done, he uploads his visualization to the website to share with others. In the mean time, the library he used makes his visualization possible to work with other data sets on the website with this visualization through the website.

This framework includes two assets:

• The website, OpenVisuals.org, which supports the framework as the place for people to upload, browse data and visualizations, to explore by mapping the data sets to visualization, and to communicate with each other using commenting, messaging, etc…

OpenVisuals Thesis Presentation from
Sinan Ascioglu on Vimeo.

• OpenVisuals Java Library, which is an API for Processing to make building visualizations easier by providing common functions. Also, this library functions as the bridge to map any uploaded visualization to any data set on the website.

This project can be considered as the ‘visualization counterpart’ of many data websites (eg. Swivel, Many Eyes, Gapminder), making it possible for users to develop and collaborate on the visualizations end.

The Fail Part

While working on this website, I preferred to design and develop while it was live on the web: anybody could see the website being developed on the fly. This gave me a great opportunity to get early feedback on the features, design and bugs. The most significant feedback that I had was to make the website open to any Processing sketch, and be less specific rather then focusing on the visualization theme. Before any visualization-sharing website, Processing users needed a place to share any of their sketches.

Upon this observation, I copy/pasted the whole website under a new domain, OpenProcessing.org, and stripped out the visualization&dataset focus by redesigning couple of pages. Since then, OpenProcessing has welcomed by the community with great interest and appreciation, and this led me to discontinue my efforts on OpenVisuals.org and put all my energy on OpenProcessing. Well, the rest of the OpenProcessing story is here.

Orion provides a valuable tool for researchers who uses video to record, observe, and quantify the once-qualitative information. It also enables researchers to collaborate on their video analysis projects and share different points of views through marking, commenting and data embedding on video elements. The version of their website didn’t meet today’s design and usability standards, didn’t include the features to enhance functionality and wasn’t extendible to serve for public use.

Mainly serving for communities on learning, research, and teaching, we revisioned the project being not only a product but  a service. Orion would stand as an information and communication tool through each stages of a research. My work in the project spanned interaction design, strategy and development lead.

Design Process

In this project, I had the chance to observe closely how researchers were using various tools to organize their data, including the way they work with pen, paper, and the previous version of Orion website. On this website, users could create a ‘galaxy’ (a project), upload a ‘star’ (a video), and other users can add ‘descriptors’ (weighted tags) for these projects and videos. I conducted focus groups to understand the value of the application and its features. I researched the similar products in the academic area.

In the concept development and wireframing phase, I combined the patterns found in generic video sharing tools (youtube, motionbox, etc.) and multi-user project management tools (MS Project, MindShare, etc.), I cleared the unnecessary jargon used in the current website and created a structure based on videos, collections and projects, to create a more user-friendly experience.

To improve the social aspects of the application, I implemented user profiles, easy-invite tools, wiki-based project management (less administration, more freedom), support for muiltiple video sources (users can add a video to their projects from youtube, vimeo, etc.). Also, I implemented many Ajax/Javascript functionality to provide on-the-fly editing, tag organization, tag quantification.

This project is partially funded by National Science Foundation, USA.