Design

Comments

Summary: Both Rupert and Gerald will use this page to create their accounts. For Rupert, it allows him to create and save his resume(s) to share with prospective employers. Gerald is more interested in the the favorites feature that will allow him to save interesting resumes.

Learnability: This is a fairly standard login page, so this should not be an issue. There is little, if anything, to learn, but the helpful text and labels for each entry location help the user understand the goal. 

Visibility: Each entry location has an icon depicting in clear metaphor (X vs √) whether the input is acceptable. Additionally, there is a count of how many items out of the total have been properly completed. Finally, the submit button only becomes colored and active once the input is correct.

Efficiency: Re-entering information is somewhat slow, but worthwhile to reduce future inefficiency of resetting accounts and dealing with support requests. Most users are comfortable with this type of input dialog, so it should not be an issue.

Error Prevention: Entering email and password twice ensures that the information has a higher probability of being correct. The labels and prompt text ensure the user enters the right info in the right field.

Summary: This will be the main page Rupert interacts with. He can choose to edit and upload his headshot, edit his contact information, and input all the information that a resume typically holds. Even though we're seeking to improve on the existing resume model, we must as a bare minimum support the same level of information found in a traditional resume. He can add multiple items in any category, and the more open "Other Information" category at the bottom of the page allows him to add leadership experience, skills, activities, interests, etc. The final design may have these more defined, but the education and experience sections are sufficient to define the interaction in this instance.

Learnability: Although initially somewhat intimidating, we reduce the impact through a number of intentional design features. The different fields are relatively consistent in layout of input and desired content, so the user will become more adept. Putting the contact info section first ensures that the user learns the interface while inputting relatively easy, unforgettable information. All of the icons (collapsible fields, help, delete, edit) will be consistent with typical UI standards, and should appear familiar to a computer-comfortable user. Finally, each input section opens up with example prompt text to show the type of information that should be put in the particular location.

Visibility: The default text will be a different color, so it is immediately clear what information the user has and hasn't inputted. The interface mimics, to a certain degree, a typical resume layout, so the information is somewhat browsable and proof-able during the content entry phase. Importantly, the save button at the bottom will depict via its color and content whether or not the data has been saved since the last edit. Collapsible sections ensure the user can see the general structure in one page, if so desired.

Efficiency: The entry will unfortunately be somewhat slow and tedious, especially for a user with an existing resume. Although the consistent formatting should allow a user to use copy and paste to more information over, our targeted population already has an existing resume (and likely a LinkedIn account) and will thus view this as repetition of previous work. We considered allowing users to upload resumes, but decided it would be more troublesome for the user to upload a resume and then have to reformat everything than to just create it properly the first time they use the system.

Error Prevention: The user knows at all times whether the data is saved, and can thus be sure of not losing information without warning. The default prompt text ensures the user knows the proper information to place in each slot, and consistency with an existing resume helps maintain an understandable, and therefore proofread-able, presentation.

Summary: This state is a lightbox (or modal dialogue) where Rupert can add supplemental information to any content item on his resume. He can add 1 or more types of information using the tabbed interface.

Learnability: Most users will be very comfortable navigating a tabbed interface, especially when the tabbed options are clearly delineated. Each section, although asking for slightly different information, is structured similarly, so the user quickly acclimates to the "Title", "Description" (if applicable), "Content" trio of adding supplementary information. Even the lightbox is, at this point, a very typical metaphor, so the user will understand that this information references, but is modally separate from, the resume page.

Visibility: The tabbed interface clearly shows the type of information the user is entering. The "Save", "Saved!", and "Save and Close" buttons remind the user that he must be careful with his data, and the stateful save button ensures that users are unlikely to accidentally lose information. Finally, the lightbox ensures that the context of the supplementary information is visible in the background.

Efficiency: Users are quite comfortable navigating tabbed interfaces, and should have no problem selecting the relevant tab. We ask for the minimal information that would provide sufficient context in order to reduce the amount of time necessary to enter information. The save and close button quickens the final interaction to get the user back to his previous location.

Error Prevention: The user knows at all times whether the data is saved, and can thus be sure of not losing information without warning. By providing a "save and close" button, we ensure that users do not accidentally close the window without saving unless they go out of their way.

Summary: When Rupert previews the viewer version of his resume, the toolbar remains at the top of the screen so he can easily access the editing state, and can also retrieve the link to share his resume, along with designating it as publicly viewable through another lightbox dialogue.

Learnability: Our design is intended to look very similar to a traditional resume, so users should have little difficulty understanding the content or presentation of information. The icons that show the presence of supplemental content describe the type of content in question, thus ensuring easy understanding of what is present. Consistency with the user toolbar from the previous mode helps link the two, and the edit buttons that pop up when hovering over a particular content item will be consistent with the edit button from the edit mode, so the user will immediately draw the parallel. Toolbar items are clearly labelled to help prevent confusion.

Visibility: As stated previously, the resume style layout means the user will be able to quickly browse the content and understand what they've successfully entered. The icons that show the presence of supplemental content describe the type of content in question, thus ensuring easy understanding of what is present. The obvious difference in presentation from edit to view state make sure that the user understands the fact that this is a preview.

Efficiency: The edit dialogue quickly jumps the user to the right section to ensure they don't forget their intention or desired change when navigating different views. Again, resume layout is an efficient presentation of information.

Error Prevention: The user cannot share their resume without explicitly marking is as public, so a draft version cannot accidentally go public. Any changes must be made in the edit view, so the user cannot make input errors in this state.

Summary: Gerald, as a viewer instead of a creator, would see this state when he clicks on Rupert's link. His main screen presents the same information as a traditional information in order to ensure easy browsability. The additional content is signalled by icons that correspond to the type of supplemental content available, so he can easily see not only whether the content is relevant to some information he's interested in, but also whether that type of content is what he's looking for.

Learnability: Our design is intended to look very similar to a traditional resume, so users should have little difficulty understanding the content or presentation of information. The icons that show the presence of supplemental content describe the type of content in question, thus ensuring easy understanding of what is present. 

Visibility: As stated previously, the resume style layout means the user will be able to quickly browse the content, and the informative icons d that show the presence of supplemental content describe the type of content in question, thus ensuring easy understanding of what is present.

Efficiency: The resume layout is an efficient presentation of information. Since viewers may only be interested in a certain type of supplemental content, and they might only want content relating to a certain content item, we don't immediately place all supplemental content inline. Still, the viewer is only one click away from any content they're interested in viewing.

Error Prevention: The typical presentation of content in a resume format ensures the user understands our augmented platform.

Summary: Clicking on a link to Rupert's 2.009 presentation brings Gerald to this lightboxed state. He can watch the video without losing his place in the resume, and can even tab over to download a copy of the pdf deliverable. When finished watching the video, he simply must click "close" to return to his place in the resume.

Learnability: As stated, users are used to a tabbed interface. The tabs are titled with the type of content available, so the user can easily select the relevant information. The close button means the user will understand how to leave the state.

Visibility: Tabbed interface ensures the viewer knows what he's looking at. The title is clearly differentiated from the content. The close button fits typical design paradigms. The lightbox ensures the viewer retains the context of the information while viewing the supplemental content.

Efficiency: The tabbed interface is easy to browse. The close button means users cannot get stuck in the lightbox. A viewer will only look at the supplemental information he's interested in, so the slight additional cost of viewing the information is mitigated by the gain of not presenting irrelevant information.

Error Prevention: There is little a viewer can do to cause problems in this state.

  • No labels