Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

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 note storage, which is organized into sections with years and classes.

Image of hierarchy with nothing created yet

On initial login Ben must either select the pre-populated school year or create a new one. Once the year is selected, he can create a class, and then create notes for that class. This is not analogous to a standard file-system hierarchy in that Ben cannot create loose notes: they must be associated with a class, and classes must be associated with years. A search bar at the top of the page allows users to look for notes without browsing through the hierarchy.Image of populated hierarchy

Ben creates classes for the different courses that he's taking. Clicking the buttons to add a year or a class has a text box pop into the list, with a default name highlighted for pending delete. Clicking the button to add new notes for a class, though, takes you into the text editor.

Image of the text editor

The title of the notes is presented in an editable text box in the tool bar, which on first open is called "Untitled N," again highlighted for pending delete, and with the focus given to it. On future opens focus will be given to the body of the notes. The text editing parts of the interface are standard: there's a large text area that Ben can type in. We allow limited rich text functionality tailored to note taking, with bold/italic/underline, different font sizes, and the ability to easily make bulleted or numbered list; all of this functionality is accessible through the tool bar or, in some cases, through keyboard shortcuts. The home button on the left returns to the notes hierarchy. The camera button on the right leads to our most interesting functionality: the ability to easily insert a picture using a smartphone. If a phone is already associated with the account, the camera button launches the app on the phone. Pictures taken on the phone are added to the camera roll on to the right of the editor. Clicking a picture inserts it at the current cursor position, or the images can be dragged to any location on the page, displacing text as needed. Since Ben is new to our app, the camera roll does not open yet.Image of the QR code download screen

The first time Ben clicks the camera icon in his account, a window opens containing a QR code that he can use to download our app on his smartphone.

Image of the smartphone app: picture taking mode

Ben can point his cellphone camera at the subject he wants to insert into his notes, and takes the photo. Once a photo is taken, the app will go into crop and upload mode.Image of the smartphone app: picture cropping mode

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 app.

...