Our introductory page. This is the first thing the user sees when the web application is opened. Three little boxes Step I, Step II and Step III explain in brief what this web app is about and what it offers. After the iterations we realized that the users have hard time locating the "sign-up" button at the top right of the screen so we moved it down and made it huge!

First time users can register by clicking on the Sign Up and entering the basic information about themselves. We made the sign up form much bigger than it was in our original prototype to make sure that the registration of the users goes as smooth as possible. 

After registration, first time users can import their bookmarks from any of the browsers they use by selecting any of the provided options and clicking on the 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. We decided to not have the log-in button and window be as big as the registration button and window are since we already expect the registered users to know how to operate the web app.

The main page consists of three main parts: the folders section(on the left), the bookmarks section(in the center) and the contacts section(on the right). The folders and and the contacts sections are labeled appropriately but the bookmarks section is not to allow more space to display the bookmarks. When the user first enters the website, there will be a default bookmark in the All folder which we believe will be enough information for the users to realized what the middle section is for.

Users can add new folders to the folders section by pressing the "" button. We believe that the green color of the button and the "" sign convey enough information to help the users realize what it is for. Once the press it, a small dialog box appears asking for the name of the new folder. If create is pressed without entering a name, an alert appears asking to enter a name. Or they can just cancel the creation process by pressing cancel.
In our computer prototype we had 3 folders in each row(instead of 1) and that made the folders too small to click and restricted the space available for the folder's name. Even though that provided good visibility because you could generally see all of your folders without having to scroll, we realized that most users are not going to have more than 5-7 folders, so it made sense to make the folders bigger and arrange them in one column.

Users can delete folder/bookmark by clicking on the trash icon on the bottom left. If a user tries to delete a folder, a warning message is displayed that asks the user to confirm his/her decision. We originally had an "x" button instead of a trash icon but we realized that the trash can is a better metaphor than the "x" button.  

The All folder that contains all the bookmarks of the user can not be deleted so if the user selects it and presses delete nothing happens. We considered displaying an alert informing the user that the All folder can not be deleted but given that alerts are annoying we thought that we should avoid them and let the user figure out that the "All" folder can not be deleted by just trying to delete it once or twice.

When the user wants to create a new bookmark, he can click on Add Bookmark and the following page will be displayed. The user can specify a Name and a URL of the bookmark, and finish off by clicking Create which will create that bookmark inside of the currently highlighted folder. Users can add the bookmark in other folders to by dragging and dropping it on other folders.
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 the 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.