...
Ben can crop out the area of interest on the image (in this case, the diagram on the blackboard behind the Professor), and choose to save or delete it. When he presses save, the photo will appear in the camera roll on the appwebapp.
All changes to Ben's notes are auto-saved by our webapp. In this design, there isn't any difference between creating notes for the first time and reviewing them later, so when Ben comes back to the notes to insert new facts from the course readings, and when he comes back again to review for a test, he just opens the notes in the organization hierarchy and views them in the editor.
...
In this design, we allow a single level hierarchy that lets you put notes into different categories, and the list of notes is displayed on the same page as the editor. Rather than inserting pictures from a camera, this design allows us to harness the ease of typing things on a laptop and the ease of drawing things with a touchscreen by using a smartphone to create hand-drawn diagrams, which will be inserted into notes taken using a webapp on a laptop.
Storyboard
The first time Ben uses SETENTS to take notes, he is presented with a standard account creation/login page. Once Ben creates his account, he sees the combined browsing / editing window. The first launch has an uncategorized, untitled notes document already open.
Image of app with navigation pane populated with stuff 
Ben can create a category for 6.006 or any other classes, and have notes inside of the categories or in the root of the hierarchy. He can drag notes into new categories to organize things. Categories can be created by clicking the new category button at the bottom of the navigation pane. Notes are created by clicking the new notes button within the category you want them to go in (or in the root of the hierarchy). Categories and notes can be deleted or renamed via the right-click menu, or deleted by highlighting items and pressing delete/backspace. A dialog box comes up to confirm deletion. Dragging the bar between the editing pane and navigation pane allows Ben to allot as much screen real estate as he wants to either.
Once Ben is satisfied with how his notes are organized, he can use the rich text editing pane to take notes as in our previous designs. When the time comes to insert the crucial diagram, he clicks the drawing button at the right of the toolbar.
Image of QR code screen 
As in design 1, the first time he clicks the button he must associate a smartphone with his account by downloading our app and signing in. He can scan the QR code that pops up to download our app onto his phone. Once Ben has associated a phone with his account, clicking the drawing button will bring up a canvas where his cursor is in the notes. If he doesn't already have the app open on his phone, the canvas will contain a text prompt to open it. Ideally we would The pane can be deleted like any image could be, by backspacing or using undo.
Images of phone app and web app with the synchronized canvasses 
Left: webapp label adding mode. Right: smartphone drawing mode.
Once the smartphone app is open, Ben can draw the diagram using the touchscreen on his phone. The canvas in his notes will show a live view of his diagram. Ben can choose from a limited selection of colors, draw lines with a single finger, and do bitmap erase with a single finger. He can also zoom in by using standard pinch to zoom, and navigate around the zoomed in image by either using the grabby hand or dragging with two fingers.
...
Bringing up the app on your phone will pop a canvas into any notes that you have Ben has open even if you he didn't click the drawing icon first.
Reviewing notes is less interesting than in our second design, since it is the same as editing. You Ben can browse through the navigation pane and locate notes by title, or use the search bar, which functions as in the previous two designs.
...