Annotorious




Long before COVID, Hypermedia Studio at IBM was investigating new forms of classroom collaboration. In this case, they were interested in how to turn a literary group discussion into a dynamic asynchronous experience for students.


Visual Direction
UI Design
User Research

Made with Skeptic






We read. We take notes. We share. We learn.


And in the past couple of decades, we’ve been doing more of all of this on our computers and, more recently, handheld devices. The problem is that we don’t really have a great piece of software to facilitate the entire experience. That’s where Annotator comes in.

Working in partnership with the Hypermedia team under the Comparative Media Studies group at MIT, the open-source developers at Annotator have been building the code-base to turn any piece of digital text into a place for collaborative learning.



The code was underway but the human journey hadn’t been fleshed out. The Skeptics were called in to research, design, and build this experience. 


We were entranced by the idea. Having all just finished graduate degrees, we knew the process of annotation. Our text books were littered with ideas and thoughts but the only way to share was photocopies or texted images. If I remember, a few of us had Tumblrs full of quotes from books.



Though we were familiar with the use case, we didn’t rest on our own experience. We weren’t the users but the designers. So we set up some working sessions with MIT to learn more.

A robust series of research and information architecture was completed and approved and I started developing a visual language. This is literary and respectful but for today’s students. The tiny screen required UI accommodations for thumbs of all sizes.



Using user scenarios and scripts, I built the visually elegant system and worked with the coding team to bring it to life.













Interactive/Web
Case Studies
Annotorious
Joanna Czech

Theatre Poster

Gallery



Conceptual/Sketch
Case Studies

Gallery












Interactive/Web
Case Studies

Annotorious
Joanna Czech

Theatre Poster

Gallery

Conceptual/Sketch

Gallery