Suzanne Collins Website Redesign: A Recommendation Report

Size: px

Start display at page:

Download "Suzanne Collins Website Redesign: A Recommendation Report"

Gilbert Lang
6 years ago
Views:

1 Memo Date: December 11, 2015 To: Ms. Suzanne Collins, American television writer and novelist. From: Matthew Chern, President at NonstopTech. Lawrence Meneses, Chief Operating Officer (COO) at NonstopTech. An Thai, Vice President (VP) at NonstopTech. Subject: Redesign the homepage of Ms. Suzanne Collins website. Attached is the report for our project, Suzanne Collin s Website Redesign: A Recommendation Report. All the tasks described in our proposal were successfully finished: improving the navigation bar, adding a carousel to the main page, rewriting the introduction and moving it to a better position on the main page, removing the Selected Works column, and adding a proper footer with useful information. In order to complete these tasks, we performed primary and secondary research. We inspected other websites with good, appealing formats and conducted interviews. After collecting all the needed data, we carried out analysis, came up with effective solutions and wrote the report. The website dedicated to the work of Ms. Collins contains sufficient information regarding her works in a disorganized manner. Due to the ongoing popularity of her works, and the popularity of online browsing, the improvement of the website is paramount. The improvement of navigation throughout the website will improve users experiences as well as encourage them to visit the site more often. As a group of professional designers, we are proposing to redesign the website which includes the different aspects such as: contrast, alignment, pictures and so on. We appreciate your time spending to read out recommendation report, and also thank you for the opportunity of redesigning your main page. We look forward to working with you. If you have any questions or comments, please feel free to contact Matthew Chern at MattChern@NonstopTech.com or at (714) i

2 Suzanne Collins Website Redesign: A Recommendation Report Prepared for: Suzanne Collins, Author of The Hunger Games Prepared by: Matthew Chern, President at NonstopTech Lawrence Meneses, COO at NonstopTech An Thai, VP at NonstopTech NonstopTech Company December 11, 2015 ii

3 Abstract Suzanne Collins Website Redesign: A Recommendation Report Prepared by: Matthew Chern, President at NonstopTech Lawrence Meneses, COO at NonstopTech An Thai, VP at NonstopTech NonstopTech Company On September 20, 2015, Suzanne Collins, a television writer and novelist and the author of The Hunger Games trilogy formally invited a group of designers including Anthony Thai, Lawrence Meneses, and Matthew Chern at NonstopTech Company to take a look at her current website and participate in determining what changes should be made to make the website more accessible to visitors. To perform such a task, we visited Ms. Collin s website and took note of what modifications that could be made to ensure the website displayed the necessary information in an organized manner. We found that there were a number of issues with the current website, mainly the lack structure to the content. The website would greatly benefit from a couple of changes, adding a navigation bar and moving around elements of the website just to name a few. Ms. Collins has become a world famous author as a result of having written The Hunger Games trilogy and the popularity of the first two film adaptations of the first two books of the series, not to mention some of her smaller works. Fans of hers feel that a more well-made and organized website would only contribute to the rising popularity of Ms. Collins, while also giving her readers a better idea of who Ms. Collins is and her work overall. We recommend that Ms. Collins consider some of the changes we have laid out in further pages of this document and consider us for a job of this importance. Keywords: suzzane, collins, website, redesign, readers, author, The Hunger Games iii

4 Table of Contents Executive Summary... 1 Introduction... 2 Research Methods... 3 Task 1. Improvement of the navigation bar... 3 Task 2. Add a carousel to the home page... 4 Task 3. Rewrite Ms. Collin s introduction paragraph and move its position... 4 Task 4. Remove the Selected Works column on the right of Ms. Collin s homepage... 4 Task 5. Add a proper footer that includes copyright, reference links, and contact information... 5 Results... 7 Task 1. Improvement of the navigation bar... 7 Task 2. Add a carousel to the home page... 7 Task 3. Rewrite Ms. Collin s introduction paragraph and move its position... 7 Task 4. Remove the Selected Works column on the right of Ms. Collin s homepage... 7 Task 5. Add a proper footer that includes copyright, reference links, and contact information... 7 Conclusions... 8 Recommendation... 8 Schedule... 9 Budget... 9 Experience References Appendix: California State University Long Beach Survey iv

5 1 Executive Summary On September 20, 2015, Suzanne Collins, a television writer and novelist and the author of The Hunger Games trilogy formally invited a group of students including An Thai, Lawrence Meneses, and Matthew Chern at NonstopTech Company to take a look at her current website and participate in determining what changes should be made to make the website more accessible to visitors. Currently, Ms. Collins has been managing her own website dedicated to her popular works. However it contains multiple limitations that cause the website look unorganized, unprofessional and difficult to gain access to. The issues prevents visitors from navigating around the website, hence decrease the popularity of the website. Ms. Collins invited us to perform research that would improve the efficiency of the homepage as well as the experience of the visitors. Additionally, Ms. Collins asked us to conduct a study on how to enhance the graphics of the homepage so that it will be more appealing to the visitors. In order to begin the research, we started exploring Ms. Collins website to familiarize ourselves with its structure as well as contents. We made a decision that we would conduct surveys and create questionnaires, gathered opinions from people that have visited the website. After collecting responses from our surveys, we concluded that the issues 95 percent of the participants faced are: the navigation bar is off to the right, which makes it hard to find; the homepage is too long, visitors find it inefficient to scroll up and down the page; the welcome message locates in an inefficient position and was written unprofessionally; the Selected Works column is confusing and redundant; the absence of a proper footer that consists of contact information, copyrights and reference links. Our group began the work on September 30, 2015 by introducing the methods to improve the navigation bar by relocating its location to the right of the homepage. Then we introduced the technique to enhance the graphics of the homepage by adding a carousel so that scrolling up and down the page will not be an issue. After that asked our colleague, who is an English teacher to rewrite the welcome message. Following the fixing of the welcome message, we made the homepage cleaner and more professional by removing the Selected Works column. Finally we introduced the footer at the end of the homepage with additional contact information as well as other useful links.

6 2 Introduction On October 2nd, 2015, Suzanne Collins, a television writer and novelist and the author of The Hunger Games trilogy formally invited a group of students including An Thai, Lawrence Meneses, and Matthew Chern at NonstopTech Company to take a look at her current website and participate in determining what changes should be made to make the website more accessible to visitors. The website suzannecollinsbooks.com is dedicated to the works of Ms. Suzanne Collins. As an author, Ms. Collins is well known through her famous series The Hunger Games. In today s society, the internet and web browsing is a popular past time for people. By illustrating her work online, Ms. Collins is allowing for avid readers and future fans to view her accomplishments. Currently, Ms. Collins have 10 books out to the public. Out of the 10, The Hunger Games series created the most buzz and helped Ms. Collin s popularity to rise. Being popular today comes with a baggage of up-and-downs. With that being said, the same critics that praise popular people for their great work, will place them in microscopes to scrutinize their flaws. Our group noticed many flaws within Ms. Collins website, which we believe could use improvements. Although the website is fully functional we believe that we could improve the interface of the home page in order to make the website easier to use. We believe that by improving the home page, we can help draw more viewers. As a team we are going to use the knowledge acquired during our time at California State University, Long Beach in improving the home page. Lastly, Matthew, a Computer Science major of the group, possesses web design skills and understands the functionality of a successful website. Currently, the main page of Ms. Collin s website looks unorganized and unprofessional. Our group noticed that the original designer of the website put little to minimal effort towards designing the website. One of the most noticeable flaws that we discussed as a group is the Selected Works section of the home page which forces the website visitor to scroll endlessly. Even though faster technology allows for fast web browsing, the unnecessary scrolling is inefficient. Ultimately, our group would like to offer ideas on how to improve Ms. Collin s website in order to: 1. To improve navigation throughout the homepage. 2. To attract more website viewers. 3. To make the website look and feel more professional.

3 Research Methods To adjust Ms. Collins website to be easier for visitors to navigate, we have broken this project down into five tasks. 1. Improve the navigation bar 2.

7 3 Research Methods To adjust Ms. Collins website to be easier for visitors to navigate, we have broken this project down into five tasks. 1. Improve the navigation bar 2. Add a carousel to the home page 3. Rewrite Ms. Collin s introduction paragraph and move its position 4. Remove the Selected Works column on the right of Ms. Collin s homepage 5. Add a proper footer that includes copyright, reference links, and contact information In the following discussion, we discuss how each task is carried out and a potential mockup of what is may look like in a finished product. Task 1. Improve the navigation bar The navigation bar is one of the most essential parts of a website. An effective navigation bar will help the visitors not to waste their time looking for what they need. Ms. Collins homepage has the navigation bar located off to the right of the page, where most visitors did not expect to find. More importantly, the navigation bar does not stand out since it contains regular font size words on a white back ground. In addition, the navigation bar does not appear to be appealing to any of the visitors that participated in our survey. In order to improve the navigation bar, it will be relocated to the left of the main page. Also, the words will be increased in size and placed on a color background to draw more attention from the visitors. Furthermore, each category on the navigation bar will switch to a different color whenever visitors move the cursor over. An example of an effective navigation bar is demonstrated in Figure 1. Background color switches when the cursor moves over Figure 1. Navigation bar on Sparkfun website (

8 4 Task 2. Add a carousel to the home page The purpose of adding a carousel to the home page is to improve the visual effects. We recommend adding a carousel that includes a link to 4 different book covers and a quick review of the book will instantly direct the viewers eyes to the home page. In addition adding a carousel will ensure that the viewer of the home page will not have to scroll down to read critic reviews. A carousel is attractive to the present day web surfer. An example, as shown in Figure 2. shows how a carousel enhances a home page. Figure 2. Carousel on California State University Long Beach website ( Task 3. Rewrite Ms. Collin s introduction paragraph and move its position In addition to creating a carousel to the home page, we recommend to rewrite the introduction paragraph in order to make it more professional. The new introduction paragraph should consist of a welcome message and a quick biography. Furthermore, a relocation of the paragraph to the biography tab is necessary to fit the new format of the website. Task 4. Remove the Selected Works column on the right of Ms. Collins homepage The purpose in removing the Selected Works column off to the side is to reduce clutter on the main page of Ms. Collins s homepage, only displaying the information that is really necessary to give the visitor an idea of whose website they are visiting. Another reason for the removal of the Selected Works column is to give the website homepage a much cleaner and simplistic look, as all the text on the homepage lacks proper formatting and becomes

9 5 confusing and overwhelming for anyone who visits Ms. Collins website. Lastly, after navigating through the rest of Ms. Collins website, we have discovered that the tab at the top of the page already lists all of Ms. Collins works, along with a short summary to give the reader an idea of what type of work Ms. Collins writes. We felt that it would be a bit repetitive to have two parts of the website dedicated to written works, not to mention a little confusing as to why it was needed in the first place. Instead of having the Selected Works column on the right side of the homepage, it will be removed entirely, giving the carousel and other elements of the homepage more room to fit on the page properly without having the visitor to strain themselves viewing Ms. Collins website. The Selected Works column will be relocated to the Works tab, with the reviews listed under their respective works they have been written for. Figure 3. Selected Works column of Suzanne Collins website. ( Task 5. Add a proper footer that includes copyright, reference links, and contact information The purpose in adding the footer that includes copyright, reference links, and contact information at the bottom of the website on each of the pages was to give the website a more finished look, as in the previous version, the page just abruptly stopped, making it a little strange to look at. Also, the footer will include some details that is standard for most websites, such as copyright and contact information, as putting these on a separate page may seem a bit too much for the little information they provide. The footer also serves the purpose of redirecting the user once they have reached the end of the page, making it so that it is not just a sudden and abrupt end to the webpage and also encourages the visitor to explore the rest of the website.

6 The footer for the website will be a simple rectangular box at the bottom of each page of her website, detailing copyright, reference links, contact information, and any other information that Ms.

10 6 The footer for the website will be a simple rectangular box at the bottom of each page of her website, detailing copyright, reference links, contact information, and any other information that Ms. Collins would like to add in the center. The color scheme of the footer is also up to her, as it could be easily changed to suit the overall color palette of her website. As seen in Figure 4, the main page is lacking a footer altogether, an element that has become standard in most websites. When the visitors get to the bottom, they are expecting more reviews of Ms. Collins works but are met with an abrupt end of page. Figure 4. Footer of Suzanne Collins website. ( An example, as shown in Figure 5, shows another author, Stephen King s website as a sample of what a footer may look like. You can see that it provides some general information about copyright and some other relevant links to other parts of King s website, while also giving the user the option to choose the language of the website. Just the addition of something as simple as a footer can really change the look and improve the accessibility of the website as a whole. Figure 5. Footer of author Stephen King s website. (

11 7 Results In this section, we present explanation for the results of our research. Task 1. Improve the navigation bar We relocated the navigation bar to the left of the main page, increase the font size to 16 and added a light grey background to it. The color is not too bright or too dark, only enough to make the navigation bar stand out. We also make the background of the tab on the navigation bar switch to orange when the cursor move over to make it more appealing to the visitors. Task 2. Add a carousel to the home page We added a carousel that has 4 different visual slides. It allows for visual enhancement and grabs the attention of the viewer. We also eliminated the need to scroll unnecessarily in order to read the critics reviews. Task 3. Rewrite Ms. Collin s introduction paragraph and move its position We rewrote the introduction paragraph and included a biography. The new paragraph is more professional and gives a quick overview of Ms. Collins. Also by moving the paragraph, the website looks more organized. Task 4. Remove the Selected Works column on the right of Ms. Collin s homepage We have now removed the Selected Works column off to the right of Ms. Collins homepage and moved it to the Works page. The carousel has been added to the middle of the page and is not cramped by the addition of another column off to the right, making it more pleasing for the visitor to see. Task 5. Add a proper footer that includes copyright, reference links, and contact information We have now added a footer to the bottom of every page of Ms. Collins website. While a seemingly small change, it drastically improves the website as a whole by pulling together all the content without leaving the reader hanging after they have reached the end of the page. Also if Ms. Collins would like to make any adjustments to the footer, whether it be the color scheme or the adding of features, the footer can be easily adjusted to suit the needs of Ms. Collins. We have also added the ability for the user to click to scroll to the top of the page, an accessibility feature that many of her visitor would greatly appreciate as it prevents them from having to scroll to the top of a very long page.

12 8 Conclusions Fellow authors of popular literary works have found that having an effective website that helps them connect with their readers is essential to attracting and keeping new readers. Authors have found that after the introduction of their personal website that their books sales gradually increased over the months that followed. Seeing this correlation, the authors have agreed that it is important for any well-known author to have a well-designed and laid out website to interact with their audience. We interviewed 100 people, and an overwhelming majority agreed with the suggested changes we had brought up. With the release of the newest Hunger Games movie, the audience is surely to be interested in who the author of this popular series is, and therefore would result in a spike in Ms. Collins website traffic. With all the positive reviews coming from moviegoers, receiving a score of 7 out of 10 on the popular movie rating website IMDB, Ms. Collins is sure to find an increase in her popularity and therefore an increase in book sales. Recommendation We recommend that Ms. Collins consider the changes we have laid out in regards to her website redesign and consider us, Nonstop Tech, as the people most suitable for the job. After surveying almost a hundred students, the main demographic of visitors to Ms. Collins website, we have found that the overwhelming majority is found to be in favor of a website overhaul consisting of an improved navigation bar, adding a carousel, fixing the introductory paragraph, removal of the Selected Works column, and the addition of a footer. Just these few changes should greatly improve the readability and overall flow of Ms. Collins website and draw even more readers to find out more about their favorite author.

13 9 Schedule In this section, we explain how the completion of each task is distributed over our working period. Tasks Task 1: Improve the navigation bar Task 2: Add a carousel to the home page Task 3: Adjust the introduction paragraph Task 4: Remove the Selected Works Task 5: Add a proper footer Dates of Tasks (by Weeks) 09/30 10/2 10/3 10/9 10/10 10/13 Week 1 Week 2 Week 3 Budget This section gives the detail about all the expenses occurred during the research process. Labor Name Hourly Rate ($/hr) Hours Cost An Thai $ $45,000 Lawrence Meneses $ $45,000 Matthew Chern $ $45,000 Total 900 $135,000 Direct Expense Name Cost Staff Travel $800 Office Supplies $200 Equipment (computer software) $500 Other $500 Total $2,000 Indirect Expense Name Cost Maintenance $4,000 Infrastructure $3,000 Total $7,000 Total Expense $144,000

14 10 Experience We are a group of professional designers at NonstopTech Company, who are fully qualified to produce a website that will fulfill Ms. Collins needs: Lawrence Meneses, COO at NonstopTech Company, has a Master Degree in Computer Engineering and graduated from Massachusetts Institute of Technology (MIT.) He has designed a robot that can cook. Lawrence is also the co-founder of LobTech (company that develops technology for catching lobsters.) An Thai, VP at NonstopTech Company, graduated from Princeton University and earned a Master Degree in Graphics Design. Anthony has designed characters as well as environment for many popular video games in the last 3 years. He has recently designed a model for BotMaid (a robot that does chores for you.) Matthew Chern, President at NonstopTech Company, was majoring in Computer Science at Yale University, graduated with a PhD. He has created multiple websites for clients with a wide range of needs, from small private websites to large scale websites for Fortune 500 companies. Matthew has also developed tons of useful applications for smart phones as well as software for computer. He is the creator of Doors (a competitor of Windows and Macintosh in term of operating system.)

15 11 References Markel, Michael H. Practical Strategies for Technical Communication. Boston: Bedford/St. Martin's, Print. (Suzanne Collins Website) (Navigation Bar) (Carousel Picture) (Footer Picture)

16 12 Appendix: California State University Long Beach Survey In order to ensure that the changes that our group is suggesting to make on the website, we surveyed 100 students regarding the different tasks / changes. Survey / Results Instructions: First of all, our group would like to thank you for your time and patience. This survey will include 5 questions that will help us improve your experience when visiting Ms. Collin s website. Please take a look at (Provided) 1. Does the navigation bar need to be moved to the top left? Yes: 68% No: 32% 2. Does a carousel (much like the CSULB homepage) improve visual effects and experience? Yes: 98% No: 2% 3. Does the introductory paragraph need to be improved and moved to the biography tab? Yes: 88% No: 12% 4. Will the homepage be more organized without the Selected Works column? Yes: 97% No: 3% 5. The website needs a proper footer (such as: copyright, links, contact information, etc..) Yes: 72% No: 28%

I think you will find our redesigning methods viable. Our research suggests that you should consider our changes towards the website.

I think you will find our redesigning methods viable. Our research suggests that you should consider our changes towards the website. Memo Date: December 11, 2015 To: Webmaster@serebii.net From: Web Developer Group, Lori Bergman, Co Executive Designer Rone Caballero, Co Executive Designer Estefany Montoya, Graphic Design Specialist Subject: