Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Corrected links that should have been relative instead of absolute.

...

In this design, Blanco is first presented with a login page, where he enters his user name and password. Upon logging in, Blanco is directed to the client's home page, where he can either click on the 'Search for photographer' button, or decide to review a photographer. Blanco clicks on the 'Search for photographer' button, and is then directed to a page where he can enter his desired search parameters. He enters Boston as the location at which he would like to receive the photography services, on the 4th of July starting at 8am. In the budget textbox, he indicates that he is willing to spend between $5,000 and $10,000. He then clicks the 'Search' button to proceed. This directs him to a page where he is requested to confirm his search parameters. If he is not satisfied, he can click the 'Back' button to re-enter his parameters. Blanco is satisfied with his parameters, so he clicks the 'Proceed' button to conduct the search. Blanco now sees the results of his query. His search parameters are at the top of the page, and his results are below. Blanco uses the provided scroll-bar to look at the first few photographers, and decides that he would like to hire Emilio's services.

Analysis of Design 2 for finding a photographer

  • Learnability
    • Starting page is a series of forms consisting of textboxes and buttons, which is familiar to Internet users.
    • Wizard Pattern helps guide the user through the stages.
  • Visibility
    • Having search parameters at the top of the results page makes it clear what was searched for.
  • Efficiency
    • Confirmation page increases time taken to view search results.
  • Error Prevention/Correction
    • Confirmation page gives a chance to check search criteria

Design 3

                                                                                                                

LEFT: At the top, there are 3 main tabs: Find A Photographer, Write A Review, For Photographers. The homepage is the Find A Photographer page. It is a series of questions about the details of the type of photographer sought for the event. It has questions such as the purpose of photography (wedding, fashion, advertisements, ...) and what kinds of outcome is expected (prints, albums, ...), how long the photography session will take, if a 2nd shooter is needed, and the budget for the event. If the user knows the photographer's name, he can just type it at the top and get results without going through the questionnaire. The questionnaire is concluded with a big Find A Photographer button.

...

RIGHT (2 photos, continuation): When you click on a photographer's name or photo, you will go to their detailed profile. There is a big Go Back To Results button. Then, at the top is the contact information and portrait of the photographer. A photographer's own description, sample photos, and pricing details, and reviews can be found after that.

 Analysis of Design 3 for finding a photographer

  • Learnability
    • Looks similar to flight/hotel booking websites
    • Presence of tab bar with different actions (e.g. "find photographers", "review photographers") makes it easy for new users to get an idea of what they can do with the site
  • Visibility
    • Search criteria is always visible in the sidebar area
    • Highlighted tabs to show the task they're performing
    • Number of results and pages shown to get an idea of how many photographers are available
  • Efficiency
    • Dynamically update results
    • Slider to adjust budget range instead of typing numbers
    • Primary and secondary sorting of search results for efficiency
  • Error Prevention/Correction 
    • Effects are immediately visible, and actions are easily revertible (e.g. toggle checkbox, select a different option from dropdown)

...

On July 5th, Blanco wakes up with a throbbing headache. He checks his email, and finds that the photographer, Emilio, has attached some pics he took at the event. Half excited and half anxious, Blanco opens the attachment, only to find that every picture has red eyes, the Armani logo on his suit is not visible, and his wife's gown magically changed color from white to cream. Furious, Blanco logs into ShutterConnect, to let the world know about the atrocities that have been committed against his person.

...

Furious, Blanco logs into ShutterConnect, to let the world know about the atrocities that have been committed against his person.

Design 1

Design 1 requires Blanco to be on Emilio's profile page to leave a comment; he can do this in multiple ways: use the "saved search" feature to go back, pick Emilio from the list of photographers he has used through ShutterConnect, or by searching for Emilio in the search bar. Emilio's profile page looks like: Image Added

Blanco clicks on the "Add Review" button at the header for reviews. Upon clicking, the following form appears in place: Image Added

He can now express his displeasure by giving Emilio 1 star and writing snarky things in the review body. To post the review, he clicks on the "Post Review" button, or if he's feeling merciful he can click "Cancel" and not post the review. Posted reviews appear instantly and can be edited or deleted by using the "Edit" link that appear on reviews left by the user.

Analysis of Design 1 for writing a review

  • Learnability
    • Not as learnable as just having a form that is always visible on the page
  • Visibility
    • Visibility problem: need to be on photographer's page before "add review" button is even visible
  • Efficiency
    • Adding review can be done in the same page (doesn't require going to a new page or any additional scrolling)
  • Error Prevention/Correction
    • Cancel button to escape "review entering mode"
    • Error correction: there's an "edit" link on the reviews you wrote so you can change/delete them

...

  • Learnability
    • Standard form-format with widgets like textboxes and dropdowns
  • Visibility
    • "Review photographer" is explicitly mentioned as a task upon login
    • Photographer's info is also shown on the add review page so that users can easily refer to details about the photographer
  • Efficiency
    • Internal scrollbar for the review items makes it less efficient to view all reviews
  • Error Prevention/Correction
    • Photographer's info shown on add review page to help prevent mishaps

Design 3

Image Modified  Image Modified  Image Modified

LEFT: Write A Review is in the middle of the top tab. Users sign up before writing a review. 
MIDDLE: They search for the name or business name of the photographer and get the short descriptions for results, to make sure they review the right person.

...

  • Learnability
    • Standard form layout for each step of signup
    • Wizard pattern to guide between one profile editing page to another
  • Visibility
    • Visible confirmation via message bar upon creation of profile
  • Efficiency
    • Less efficient because process is split into multiple steps
    • Sample photos are added one at a time.
    • Price structure is entered as text so photographers can enter their customized price message.
  • Error Prevention/Correction
    • Distinct buttons: "sign up as photographer" and "sign up as user" to prevent users accidentally signing up as photographers

Design 3

Image Modified 

...

 

LEFT*: *Photographers also need to sign up and/or log in. Because a lot more detail is required, it is unlikely that users will sign up by mistake as a photographer.

RIGHT: The photographer's profile page looks a lot like the profile page of the photographer that the user sees. The difference is that everything is click2text editable for the photographer. The entire pricing set is edited at the same time. Little save-cancel buttons appear for every slot (description, contact info..). Sample photos are populated with placeholders that the photographer will replace.

...