NoteMap
a programmer's favorite notebook
13
In-depth user tests
126
Languages supported
1
Project fair award
What is it?
NoteMap is a website that helps you take code-related notes. It allows you to take down snippets of code as well as regular notes and link them together, so you don't have to forget what that one confusing line does ever again. It was a class project for the senior project course at Stanford.
My role
NoteMap was a team effort among two friends and myself. One team member focused primarily on the design and some of the front-end. Another focused on most of the Javascript for the note and code editors. I focused mostly on the back-end and on various pieces on the front-end. In addition, we all worked together to perform needfinding, perform user interviews, create sketches, and conduct user tests.
The Process
We began the project by first interviewing as many students and professors we could find. We wrote down all of our observations and synthesized them into needs that could be addressed.
One of our first, rough sketches, making an attempt to bring notes and code together and to organize them efficiently.
This is a medium-fidelity mockup we created after combining some of our favorite sketches. We received great feedback on it regarding color choice, emotion, and usability.
After making revisions to our design, we completed an initial prototype and began user testing. Boy, there were a lot of bugs.
A revision on our design, incorporating a great deal of feedback and a first attempt at showing one of our key features - linking.
After countless revisions and user tests, we have NoteMap as it is today.