Analytics, that’s a big deal.

In the design of such large scale websites, the use of analytics should have a very important role in the design process. Working with analytics partners such as Omniture, I am working on analyzing the analytics data to provide us initial design directions, find the potential flaws in the user experience, and success of launched projects.
Analytics information is especially important when it comes to user flows: In the recent redesign of the registration process in BMWUSA, I used the analytics information effectively to provide valuable insight, including dropouts, success rates and conversion. Providing a visual representation of this data, we worked with the client to reduce the number of steps and simplify the registration process.

It’s a thought process, after all.

Dotglu has a very good design approach to make sure what we produce is a result of an established process of thought and design. I am working with other designers and producers to have the workflow of design-to-product with its brainstorming, ideation, sketching and concepting. As an interaction designer, my wireframes are going through phases of client presentations, comping, and they are the key in working with developers on functionality specifications and quality assurance.

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.

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.

This post is password protected. To view it please enter your password below:

Password: