Jobious GR2

Scenario

Paul Williams is a rising Senior in 6-3 at MIT. He has just finished a summer internship at Facebook where he was allowed to plan his own summer project and given significant freedom as to its design and implementation. It went live on the site at the end of the summer and now 25 million users regularly use the feature he implemented. Realizing this is a rarity, he wanted to tell other people about his positive experience so Paul goes to Jobious to post a review about his experience. After logging in, he navigates to the review submission page and completes a survey about his internship.

After posting his review, Paul wonders what steps people make did after they had this internship. He searches for the Facebook software internship he held and begins reading the reviews, most of which describe an experience similar to his. He doesn't recognize any of the names of students that held the internship in previous years, but they have listed their contact information. Using this he sends Tai Conley, a recently graduated alumnus who held the Facebook internship the year before Paul and now works for Amazon in the electronic services division, a message saying he would like to know more about the positions that will be open to him. Tai and Paul exchange messages a few times trading both stories about their time at Facebook and commentary about the next steps in both of their careers, leading Paul to apply for a position at Amazon as per Tai's recommendation.

Designs

Tree Design

Scenario

On login Paul is presented with the positions that we have automatically matched to their profile preferences based on previous activity. Since he is a software developer most of the job postings are from that sector.

Paul would like to view Jobs specifically at Twitter. To find his job he clicks on the All Jobs link in the top of the page. This view allows Paul to navigate to positions by major or to filter the large number of positions using the ranking metrics or keywords. While the rankings such as pay and hours offer review searching or keyword search which searches both reviews and job titles. Paul enters "Twitter" to navigate to the company's page.

After some pruning the search tree through his keyword search, Paul arrives at a listing of the company's available positions. This also lists the aggregate ratings that people assign to the positions. The higher the aggregate rating, the larger the node appears on the screen.

Paul clicks on the UI Developer node, as that was his position, and this takes him to a breakdown of the ratings of the position. Each node at this level represents the number of reviewers that gave it that ranking. The sie of the nodes in the graph is again relative to the number of reviewers that assigned it that rating. Paul can view all the reviews that gave this position 4 stars by clicking on that node, however he does not want to be jaded by other's interpretation, so he clicks on the plus sign below the central node listing position title to add a new review.

After clicking on the add review button a modal dialog pops up which allows Paul to say when he held the position, rank on a scale of 1-5 various components of the job including hours, pay, stress, difficulty and a free response section where he enters some stories about his time at the job, and say whether he wants to post this anonymously or be able to be contacted about this job. Once he is satisfied with his review he clicks on the Post button at the top of the dialog to return to the previous screen where the size of the nodes and the rankings update. He gives the position a high ranking of 4.5 stars.

Curious about what others have done after this summer internship, Paul now wants to read the 5 star reviews of the position. He clicks the 5-star node which brings up another modal dialog with all of the 5-star reviews listed and all of the fields he completed. He find's Tai Conley's review particularly relevant to his experience and wants to know more about him. Since Tai has marked his review as not anonymous and he is willing to be contacted about it, Paul clicks on Tai's name in the dialog. This launches Paul's favorite email application with a form email already composed stating the he held this position and would like to be contacted at his convenience. Paul makes some minor changes to make it more personal and then sends the email.

Comments on Usability

This design is intentionally overly simplistic, particularly in searching for positions. The filter box, while always available, simply serves to prune the tree at and beneath the current node. This is inherently different from global search and will need to be called out to the user in an effective way.

This design also segments the use of the application as a messaging client to a separate email client. This approach makes the design less usable as there are multiple places that you will have to look to find who you have contacted previously, but keeps searching for jobs and posting reviews about jobs as the primary focus.

The size change of the nodes in the review tree should give better visual feedback to the user than a mere number, however it may lose some points in learnability as the positions of the nodes may change with the number and distribution of the reviews received. There is also an opportunity for increased messaging by showing the rate at which a position's reviews are going up or down by changing the color to green for positive, grey for neutral and red for negative. This could indicate whether it was just one summer that was bad and they are improving as opposed to wide variance in reviews.

The most common error we expect with this design is miss-clicks on nodes causing the user to descend the search tree a level. This is mitigated in two ways:

• There is a breadcrumb at the top of the page showing how the user navigated to their current location
• Each node also has a link leading back to its parent

Other possible errors include applying an incorrect filter, but this is mitigated in the same way as a miss-click.

Minimalist Design

This sketch design is the “minimalist” approach for a UI of our idea. The main goal in designing it was to minimize the amount of effort needed for any one action the user would like to carry out. It also minimizes the amount of different pages and windows the user has to navigate through when doing these actions through the use of our "Nav-Bar" which will always be accessible (it scrolls with the scrollbar). Selections from the Nav-Bar will update the main window accordingly so that the user, in essence, never goes to a new webpage.

Dashboard/User Homepage

Shown here is the “dashboard” or user’s homepage seen right after the user has successfully logged in.

At the top is our universal search bar. This allows the user to simply type in anything they wish to search for (it also has auto-complete suggestions) and hit the search button (or hit enter). The results will then populate the big window in the bottom left (also shown in the picture). These listed posts have a title describing the type (interview/internship/job), position, and company along with an overall rating of the position. There is also the option to “favorite” the post if the user wants to add this particular post to his favorites list by simply clicking the star to the far left. Along with searching, clicking either the “Recommended” or “Favorites” in the Nav-Bar (underlined in the box to the far right) will also populate the main window with posts accordingly. Clicking on any of these posts will simply display that post in the window.

Messages

Clicking “Messages” in the Nav-Bar will update the window as shown below:

The main window is simply updated to display the user’s past messages with other users. Each entry has the username of the other person, a subject (if any), and a preview of the message. Clicking on any of these messages will display the message in the main window.

Profile

Clicking “Profile” in the Nav-Bar will update the window as shown below:

This is simply an edit profile page. The user can update their name, DOB, majors, interests, etc.

Clicking “Post Review” will display our generic review posting form (as seen in the Tree design). This is similar in all of the different design approaches we have.

Clicking “Advanced Search” will display more parameters (such as specific Class Years, Majors, etc.) that the user can use to refine their search.

Scenario:

From the descriptions above it is clear how our user Paul would sign in and easily complete each of his tasks. After logging in successfully, posting a review is very straightforward. Paul just has to click “Post Review” in the Nav-Bar and fill in the form with details about his experience at Facebook. After posting, he could then do a general search using the universal search bar or a more advanced search using “Advanced Search” and get a list of other posts about Facebook. While skimming through them he would see Tai's post and open it up. After reading the details and wanting to follow up, Paul simply clicks Tai's username from the post and sends him a message. From here Paul can have a conversation back and forth with Tai in his "Messages" tab (selected from the Nav-Bar).

GOOD/BAD

The obvious good point overall about this design is its very simple. Almost every action the average user would want to do is only one click away. As a result this interface should be very easy to learn and interact with. It is clear how to search, get to the user’s favorite posts, update their profile, etc.

In terms of visibility, everything is located on one main page. All the different actions that the user would want are located in the Nav-Bar to the right, which is always visible.

This design is also very efficient. Every common user action is only one click away. The only issue currently about efficiency involves the user wanting to open multiple posts at once. This interface does not allow the user to compare and contrast posts without opening a new window.

There are very few errors that the user is even able to make. One obvious error would involve using the search bar and entering incorrect search terms, however, these faults fall completely on the user. In an effort to help reduce these errors, we provide auto-complete suggestions.

Widget Design

Scenario

User Jones is a Sophomore in course 14 looking for a summer internship position in a consulting firm. He registers for a Jobious account and logs in for the first time.

This design follows the approach of placing all the features in one "widget." Shown below is the page that Jones sees when he first logs in. On the upper left, there is a "Recommended" window that shows postings that are related to interests that the user has already specified. Interests could refer to reviews related to a certain major. It could also refer to reviews related to a certain position or company. Say user Jones indicates that he is interested in associate consultant positions within course 14 and 15, whenever there are any new review posts on the website that meet these criteria, it show's up on this box. Each entry contains the company name, position and rating statistics. Jones starts reading through the list of reviews on companies he wants to get interviews with and is getting a better sense of which companies really stand out in certain areas based on the ratings. He clicks on an entry to get a more expanded view of the review including the full text comment. Through these comments he's already getting tips on how to get interviews with these companies.

On the upper right, Jones finds the "Recent Activities" box which shows a record of the user Jones interaction with the website. Whenever he posts a review or adds a company to his favorites list it appears on this box. This way Jones is able to keep track of companies and reviews he's encountered on the website.

On the lower right, User Jones finds the profile box which contains his personal information and settings for the recommendation feature. This box also tells him how many reviews he has posted so far. There is an "edit" button on the upper right of the box that lets him update this information.

Jones finds three buttons on the bottom right. The Add Review, Filtered Search and favorites buttons. Clicking on either button comes up with an expanded view of the feature. They are collapsible after use. Jones thinks this makes the widget less cluttered at first glance. Shown below is the expanded view for the Add Review functionality. It contains the review form. Jones just arrived from an interview with the Boston Consulting Group and decides to share his experience. So he clicks on the Add Review Button and fill the form that comes up. When he is done submitting the form, he collapses the feature by clicking on the minus sign on the upper right corner of this box.

Now user Jones is interested in searching for all sophomore year reviews that are related to courses 14 and 15. He clicks on the "Filtered Search" button which is as shown below in the expanded view of the feature. It contains the different inputs fields for the filtering parameters and the bottom contains a list of reviews that meets the filtering parameters. And Jones can change the ordering of the reviews based on the parameters specified earlier by using the "ordered by" drop-down menu on top of the list.

Jones recently heard about Oliver Wymann Consulting from a friend and decides to do a Search. He starts typing in the company name in the search bar and the autocomplete complete suggests Oliver Wymann after three key entries. He picks it from the suggested list and a canvas drops down from the search bar covering the other feature as shown below. This Box contains a list of reviews that are related to Oliver Wymann. He finds ratings and full comments on each item. Jones finds a lot of these reviews interesting and would like to refer to them in the future. He finds the heart (favorite) icon on to the right of the reviews and clicks on it to add it to his favorites list. After he's done viewing the reviews, he clicks on the 'X' icon on top of the results box to go back to the default view of the application. User jones clicks on the Favorites button at the bottom of the page to read the reviews further.

Usability Analysis

Visibility is one of the strong points of this design. The user immediately see recent posts that he would be interested in. He also is able to refer to past activities on the "Recent Activities" feature. Given that all the features are on one page, the user can easily tell how to do various tasks.

This design is lacking from a simplicity stand point because we have to figure out how to fit everything one page. However there is simplicity in the way the user interacts with the interface because of the all-in-one approach.

This design approach leads to better efficiency because all the necessary features are available on one page, therefore the user does not need to navigate to different pages in order to access the features. The autocomplete feature that comes with the search also increases the users efficiency in exploring reviews.

One of the pitfalls in this approach is that the user might make errors where they click inside another feature unintentionally because of how close they are to each other. There is also an issue that might arise from the scrolling behavior. Since there are multiple boxes with a list of data on them the user might use the window scroll as opposed to the inner scroll unintentionally. The best way to mitigate is to indicate when a particular feature is active by highlight the panel of that box or applying a halo like effect around the edges when the user is using that feature. This make it easy for the user to tell which feature will be affected when he scrolls.