Versions Compared

Key

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

...

Photos

Description


Our introductory page. This is the first thing the user sees when the web page is opened. Three little boxes Step I, Step II and Step III explain in brief what this web app is about and what does it offer.


First time users can register by clicking on the Sign Up and entering the basic information about the user.


After registration, first time users can import their bookmarks from their current browser by selecting desired browsers and clicking Continue button.


The next time users visit the page, they can sign in by simply clicking on the Log In field and providing their email and password.


In this design we tried to combine different features from different designs from GR2. Majority of the page is occupied by visual representations of the bookmarks. On the left of the page, current folders are displayed. Two default folders are All and Shared. Folder All contains all of the bookmarks, while Shared contains bookmarks that has been shared with you by your friends. Users can simply search for desired bookmarks by entering the name of the bookmark or a key word into the Search field, after which all of the bookmarks that fulfill search criteria will be displayed bellow.

Users can easily create new folders by clicking on the plus button (bottom left of the screen), which will create a folder icon in which they can enter the name. (Next picture shows the new folder Classes created)


User can delete folder/bookmark by clicking the X on the bookmark picture or X on the folder icon. If a user tries to delete a folder, a warning message is displayed that asks the user to confirm his/her decision.


When a user wants to create a new bookmark, he can click on Add Bookmark and the following page will be displayed. User can specify Name and the URL of the bookmark, and finish off by clicking Create which will create that bookmark inside of the current folder. Users can change directory of the bookmark by simply dragging and dropping a bookmark into a desired folder.
There is also the option of importing bookmarks from the browser, which would lead the user to the dialog similar to the one at the beginning, when user also had an option to import bookmarks from different browsers.


When a user wants to share a bookmark, he can enter the email of the person he wants to share it with, and click Share. If the button Share is clicked on before email address is entered, a message is displayed telling user to enter the email address before deciding to share.

Briefing

"You heard about a new website for managing bookmarks from your friends and you decide to check it out. You land on a page that you are seeing right now. We will give you a few tasks that aim to test this user interface. Please think aloud and feel free to explore the interface."

(We gave users only a short briefing in an attempt to test the visibility of our application. Because all 6 users were tech savvy, we did not have any problem with this. However, we will adjust this briefing in testing sessions with users who have not used bookmarks before. We will explain the purpose of traditional bookmarks and then general description of capabilities of our application.)

Scenario Tasks

The tasks we gave to users were divided into three main categories as specified in our previous reports:

  1. Creating and Managing the Account on MyWeb
  2. Interacting with my MyWeb
  3. Sharing

Each of these three main categories is divided into sub-tasks that we gave to users. Because we wanted to test the behavior of our interface in the absence of explicit tasks, in order to test the visibility of all the features, we decided to change the last user testing to accommodate that. To the last user in the second iteration, we just told about three general tasks and asked him to explore the UI himself, as much as possible.

“Creating and Managing the Account on MyWeb” task contained:

  • Sign up for MyWeb
  • Import bookmarks from Firefox
  • Change password
  • Import bookmarks additionally from Chrome (once user is already logged in)

“Interacting with my MyWeb” task contained:

  • Tell us what you think you are seeing now (given immediately after sign up/log in)
  • Create a new folder and name it “Classes”
  • Add a bookmark for 6.813 stellar page to folder Classes.
  • Create a new folder, name it “MIT” and move your bookmark for 6.813 from folder Classes to folder MIT.** Would you expect the bookmark to be present in both folders or only in MIT?
  • Remove folder Classes
  • Change the name of the 6.813 stellar page bookmark to “UI”
  • Find all the bookmarks that contain word “stellar” in their name** What do you expect that search does? Where does it search?
  • View all the bookmarks you have
  • View all the bookmarks shared with you / what do you think that folder “Shared” contains?

“Sharing” task contained:

  • Share 6.813 stellar page bookmark with your friend Jovana.** What do you need to know for this task?
    • How would you obtain it?

Observations: Before the Iteration

...