Home page designs posted (part 2)
NOTE: This entry has been re-posted to open a new set of comments.
Images were re-ordered. All previous comments are in the post below.
The committee and working subcommittees have met at least once a month since beginning the project in April. In addition, the committee has had meetings with many campus constituents (some multiple times) as well as focus groups with each of the target audiences, including current students, faculty and staff, prospective students and alumni. A survey of nearly 1,800 users was also conducted early in the process as well.
As a reminder, this project entails the re-design of the www.ncsu.edu homepage as well as the creation of ~ 100 top-level "core" pages. It does not include the re-design of college, unit or department sites though some guidelines and templates will be created and shared.
Primary goals for the re-designed homepage:
- Embody the NC State brand and convey critical marketing messages
- Create a simplified structure and improved user-centric navigation to improve usability
- Enhance the visual design
- Focus on prospective students
- Create a sense of community and collaboration
To make yourself familiar with the page elements review this earlier post. Please note, these are just flat images and not programmed HTML pages at this point. All designs will be reviewed for compliance with regulatory requirements under ADA and section 508 of the Rehabilitation Act.
We encourage you to provide feedback on the visual design, sharing your thoughts and input on your favorites, things you like, dislike, or would like to see included (or omitted) as well as any other thoughts you may have. As mentioned above, the content on these concepts is not final yet. Please use the comments field at the bottom of this post.
Click on each thumbnail image to see a larger version of the design concepts.
Concept 1 - Your Story. Your NC State.
This concept was developed to focus on the unique stories and achievements that NC State faculty, staff, students and alumni accomplish daily. In addition, we are trying to create/encourage some user interaction with the site (see "Share Your Story"). This idea needs to be further defined but think of it as a mechanism for users to add to the homepage content or share stories that may be of interest to others.
The biggest difference between this design and the two that follow is the treatment of the main feature area. Rather than focusing on one primary story and cycling through other themes, here those stories are featured through individual stories and profiles from throughout campus. This could be a feature on a student's unique experience (perhaps a community service effort), faculty research or an accomplished alum among countless others.
We are envisioning new stories and content being added regularly and this is indicated through some of the images that have the "new" tag. Similarly, older stories are faded back.
As you'll see in the second of the two jpgs, as you roll over the different images you'll see what the content is related to (research, outreach, campus life, etc.) and you can click on each image to get the full story. That content could be a video (as is shown here) or another page with image/story, link to another site or some form of other media.
Other page elements (news/events, secondary story, quick facts) are on the second half of the page.
Concept 2 - Utility
This design has the same page elements as the "action" concept but is much more utilitarian and content-heavy. Similar to many of the news and information sites visited regularly on the Web (CNN, MSNBC, etc.), this design has a main story/image and related content and links (in the gray box). You may notice that we are showing that the main area could be video in addition to being a static image. The same is true for concept 1. Don't worry, we've heard that if we use video it should not auto-play on page load.
The colored text tabs at the top (by the "Get Involved") would function similar to the tabs in the first design and change the main feature area to related content. Different from the other concepts, the search and quicklinks fields are in the left column with the other navigation in this design.
Concept 3 - Action
This design features a large, dynamic image in the main promotional area. The image and related story/content are intended to show the kind of action and activity that happen every day on NC State's campus.
The large image would load randomly (i.e., on one visit you may get a research-related image while the next time you may get a campus life image) but you can also select your interest area by scrolling through the tabs and arrows below. If you selected one of the other areas the whole top area would change to that featured image/headline. For example, you can see that the research "tab" has been selected in this version. It is envisioned that the image/story for each of the categories (academics, research, outreach, campus life, diversity and international) would change every 3-6 weeks.
Other page elements include a news/events area (you can tab between the two) as well as a secondary story, quick facts and campus slide show.
This design features a large, dynamic image in the main promotional area. The image and related story/content are intended to show the kind of action and activity that happen every day on NC State's campus.
The large image would load randomly (i.e., on one visit you may get a research-related image while the next time you may get a campus life image) but you can also select your interest area by scrolling through the tabs and arrows below. If you selected one of the other areas the whole top area would change to that featured image/headline. For example, you can see that the research "tab" has been selected in this version. It is envisioned that the image/story for each of the categories (academics, research, outreach, campus life, diversity and international) would change every 3-6 weeks.
Other page elements include a news/events area (you can tab between the two) as well as a secondary story, quick facts and campus slide show.
Please share your thoughts and feedback in the comments area.
60 Comments:
Concept one looks more user-friendly. People will see it as a more welcoming home page, especially those prospective students. As a student I think it would be easier to navigate as well.
i think concept 3 is a hands-down winner!! It looks great stylistically, while maintaining a user-friendly interface.
Concept three (Action) is the best. In a glance, it is easiest to identify all of the elements on the page in this design. Also, the graphics are the most vivid and engaging. The "Your Story. Your NC State. Express Yourself." theme of concept one seems overy emotional. Concept two (Utility) is slightly confusing navigationally as the "Research - Student Life - ..." menu across the top is easily mistaken for the main menu bar on the left side, and the search box is not in the upper right as most pages are and therefore where people look for it. One way to make the main menu bar more useful is to have subtopics under each main topic (perhaps on rollover for space considerations) so that people can get to the most commonly needed information in one click. Also, subtopics help clarify what is actually included under the main topic (i.e. I have no idea what I might find if I click "Partners"). See msu.edu as an example.
No. 3, votes this surfing mom of a prospective student. It's more visual, more appealing, seems more unique. Trying to look like a a major "news" website would be wrong, given the way most of those pages are "designed."
Caution: How unique is it to your school? Did your designers give you something totally new or did they already sell same ideas and coding to someone else? It's worth checking.
See:
http://www.ivygateblog.com/blog/2006/11/of_all_the_things_china_covets_about_princeton_it_covets_most_its_html.html
"Action." definitely. if you're going for simplicity choose "your ncstate"...but the one that really grabs and says "wow" is "action"
concept 1, the others are just horrible
I like Concept 3 (Action) the best. It's appealing and vivid and captures the attention of the viewer.
I like Concept 3 the best!
The first response here says that people will see design #1 as more welcoming, especially by prospective students.
As a prospective student myself, I don't think so. Design #1 is goofy and as another commenter said, overly emotional. It also doesn't look professional. Maybe the "Your NC State" is a good idea for a 2nd-tier page, though the design sucks.
I vote for design #3. It is the most straightforward and clear, plus it looks professional. I imagine that any type of visitor would be impressed by this page, including prospective students, current students, researchers, donors, etc.
Concept 3 is the most effective. It stands out, emphasizes on NC State brand and is easier to navigate.
I think design 3 is the best. It looks the best aesthetically and is the most professional of the three designs. It also seems like it would be the most interactive of all the designs too. The action-oriented theme is a great complement in advertising NC State's focus on research.
Concept Three (Action) is definitely the right choice for the NCSU homepage. It has a great layout and the right combination of eye-catching graphics and content presentation.
Concept 3 (Action) gets my vote. It stands out and is appealing. The subject matter is clearly displayed and memorable. NCSU is known for it's mathematical and science basis. The essence of these subjects is clear, and finite distinction--which this design conveys.
I don't particularly love any of these designs but the third one looks like the best option. Why are we focusing the student page, which is mostly used by current students, towards only the prospective students?
concept three (Action) is definitely the best. The page is warmer and fuller than the other two. I think prospective students will be impressed by design 3, and current students and faculty will find it more useful.
I didn't see mention of "International" or "Global" in the three design concepts. Most of our peer institutions have included some tab pointing to international programs/opportunities on their homepages. One of the key ingredients of a well-educated and marketable student, is their international preparedness. Such a commitment will make NCSU standout.
As someone who is directly affected by this decision I want to encourage everyone to look at the concepts from all angles. Everyone likes eye candy, it's what gets your initial attention. Lets call it the "wow factor". The wow factor lasts soo long until you find you can't navigate the site... then it's useless.
So when considering a new website think of the following:
1) How easy is it to navigate? Can you find in 3 seconds what you are looking for
2) Target audiences are NOT just students. They are other faculty from other colleges, local businesses, alumni, etc... if you were them, what would you want.
3) What would you want in a front page? What's the first thing you as an individual look for in a site.
That said... I personally vote for "Action". (It was #1 in the previous blog and now #3.). Action is the easiest to navigate and something I wouldn't mind having as a homepage when opening a browser. The other two have major color and crammed interface issues in my opinion.
By the way, your reviews are being read and noticed. So keep them coming!
I think concept three is the best. Visually it is the most interesting, although, all the pages look a little busy.
Concept three I think is by far the best of the give concepts. It's the most visually appealing and informative of the three.
Choice 1 has many elements that are important to make it easy to read and find what one seeks. There is visual depth through the use of color and contrast that allows your eyes to easily see what is on the page. Choice 2, on the other hand, has a lot of text with very little visual distinction between the content areas--my eyes don't know where to look first. Since this Site is built primarily for the prospective student, I don't know if the flat style of #2 would be visually appealing to students. From what I have seen, students would rather have a busy webpage with all content in front of them. The concept of #3 is interesting, but as others have noted, there is more upkeep. Are the resources available?
I do prefer the images used in #3 than the one of the female with the glasses in #1 & 2. the look on her face sends the wrong message, especially in #1 where you can see her expression much better. Therefore, if images will be used this large as in #1, they need to be strategically chosen, possibly create collaged images or grey out the images so that it takes more of a background role. Basically, if an image is going to take up most of the screen real estate, it has to have great meaning. The elements I would like to see remain from #1 is the way the left navigation visually "pops out," the ability to scroll the diversity, research, etc links along with the associated images. Presented this way makes it more inviting for students to link rather than how they are displayed in #2. Also in #1, I like the visual breakup of events, headline, by the numbers, slideshow, etc., content sections.
As for the NCSU logo headers, I prefer #3 first and #2 second. #2 will be easy for other departments to adopt if needed and the associated links are very apparent as is the APPLY NOW button. I don't like the white search/quick links box in #1--there is too much attention on it and it has no visual appeal. There will also be extra work involved to ensure the image (as it changes)looks good with the logo header on top.
So, my recommendation is to primarily use elements from #1,and use the image concept (providing it is feasible to upkeep) and logo header from #3. Thanks for asking for our feedback.
To make sure it is clear on what I just posted...the post that begins with "Choice 1 has many elements that are important to make it easy to read and find what one seeks." I am referring to ACTION as choice #1 (06_10_23_revised_home_01_700916.jpg)
Concept 1 is pale in comparison to the other two.
Action is by far the most impressive looking and engaging.
One problem I always saw with the NCSU website is the lack of attractive "Admissions" or "Prospective Students" links.
I'm obviously in the minority here, because I think that design 2 is overall the best.
I think people react favorably to design 3 primarily because of the large image. I would wager that if you did wireframes (no photos or graphic design elements), people would like design 2 better because it seemed less cluttered and better organized.
I personally like the use of white space better in design 2. The elements on the page are clearly organized and easy to figure out. On design 3 things are busier and more crowded together. Of course, research shows that prospective students often like cluttered pages - something I refer to as the MySpace effect.
Design 1 is the weakest by far. Can you say "mystery meat navigation"? The little photos don't tell you what they are or where they go. People with a lot of time on their hands will take the time to play around with them. Half of everyone else will never know the photos are links. The rest probably won't care.
I think that you could get greater acceptance of design 2 with a few changes.
1. Make the photo larger by sacrificing some of the gray area to the right, by slightly decreasing the size of the "Get Involved" bar, and by moving the caption over the photo (and extending the photo down more).
2. Visually tie the "Get Involved" bar to the photo by using a darker background or other visual design element.
In the end, either 2 or 3 will work, but to me 2 is clearly better.
Are you going to do any user testing with these designs?
Concept 3 is the nicest!
While I would agree that the aesthetics of Options Three are most appealing, I find the Your Story; Your NC State theme intriguing. This approach provides the best opportunity to answer the most relevant question for website visitors regardless of their role (perspective students & faculty, current school population and alumni): What role can I play in the NC State community? The State experience should be much more than just a financial transaction- tuition, paycheck or donation. However, across such a large institution its hard to understand how many different ways there are to add to the community. Option 1 seems to present a variety of first hand examples of ways in which individuals are heart of the community.
I find "Action" the most effective design. The different elements are distinct and clear, and they all beckon attention. Overall, it's an attractive and functional design.
"Utility" holds its own, but it just isn't as vivid and engaging. I like the look of the Research/Student Life/etc. tabs in this concept. But this element stands out here because it is stylish with the use of color while the rest of the page is rather, well, utilitarian.
While I think the "Story" concept looks nice, I don't think it works. So much page area is allocated to "your story" that brand and headlines aren't impressed and remembered. Also, I just don't like "Share Your Story" as an interactive draw for a home page with a stated focus towards prospective students. Perhaps alternate or replace the slideshow with the story concept, featuring a different random story on each page load?
Just my two cents!
I like design 3 the best. The more liberal use of red in this design really made the page jump out at me and get my attention. I think the highlighting one "big" story will better grab the attention of someone casually surfing by, and the arrangement of the other menus is more convenient for repeat users.
"action"--number 3--is by far the most engaging, and once people see it as a DYNAMIC page I think everyone will love it. . . Someone mentioned that there should be mention of State's international programs/impact, etc., and I agree. Definately showcase our international programs, such as the Prague Institute, Center For Universal Design, etc . .
Someone else mentioned they liked the "white" space in example two, and how it looks so much nicer. . . I think that the addition of "white/blank" space is fine, if it were a blog!
We can all agree each version has it's own pro's and con's with Action overwhelmingly getting the most support.
However, I posted this on The Wolf Web (ncsu student dominated message board) and after about 100 or so comments a member of the board took the "Utility" design and modified it. I thought you should see this.
The artist claims no ownership of said image. He simply altered their design to be what he considered a "better" version.
http://i64.photobucket.com/albums/h173/bigman157/NCSU_hp.jpg
Why not ask students to design the website and select the most creative designs? More inputs are apparently beneficial. I am sure there will be many student webmasters.
Number 3 looks the best out of these samples, though I like the original NCSU page better than these designs.
In reference to the comment about why not let students design the page...
The website is not tailored for just students. Who is the target audience? It's not just students. It's the community, researchers, Government, other countries, local and worldwide businesses, etc.
Having someone not affiliated with the school would have a much better objective approach that would reach all audiences that we want.
Concept #2, "Utility" is the most fitting design for our primarily scientific institution. Proposals 1 and 3 waste page space on making the page look overly emotional or, for lack of a better term, overly "pretty for no reason other than to be pretty." The "Utility" design presents the information in a clear, concise, accessible manner; nearly all current students and most prospective students prefer a site that quickly presents the information they want to a site that looks good but is difficult to navigate to the information they need.
Concept 1 is too busy. My eye was drawn all over the place. Concept 3 is too heavy, too blocky (technical term ;)), too boring. I like Concept 2. It's light, not intimidating or busy. Very matter of fact and simplistic.
The Third One!
I have visited numerous other university websites and NC State's website is one of the best if not the best one out there. For three reasons. Simplicity, Appealing to the Eyes, Easy to navigate. Choice three is by far the easiest on the eyes, by far the simplest, and will be easier to navigate. Just because a page as a lot of links to click on does not make it the easiest to navigate, in fact it makes it harder. Having fewer, clearer choices will make it much easier to navigate for those not familiar with the website. And those that are familiar with the website will not have to go through extra clicks to get to the pages they want to see, because just like me, they will have the pages they want to go directly to saved on their favorites.
How about getting a good overall format for ALL of NCSU that is uniform. Each deparmtent has different looks.
Also, how about an email system with a calendar that works for ALL of NCSU as well??
Thanks!
I've been disappointed from the start that there has been very little to no actual ergonomic usability testing with these designs. However, using a heuristic evaluation on your flat images, Concept 3 (Action) seems to provide good visibility of options and clear navigation. This group should really have someone on the team that knows something about user testing for usability before we get another web page that has pretty design but you can't find anything on it.
It is sad that this is the best of what the committee considered. Although hard to believe, it is a step backward from the terrible front page currently in use.
Maybe what is needed is a service entrance -- a page to be used by students and faculty who want to actually find information, then the administration can play all they want to buff their image.
I would definately choose Choice #3. Visually appealing, ease of navigation.
Concept 3 is the best of all..
Followed by one and two closely
Concept 3 is the best of all..
Followed by one and two closel
Concept 1 is out.
Action is initially appealing, but when you get down to it, the large photo takes up way too much desktop realestate.
Concept 2 (Utility) is better over all, but could be improved by making the navigation more prominent.
The problem with the designs...I would not want any of them as my home page for my browser. Given that, it will become painful to find information using the new web site. Someone needs to use the KISS principle.
The purpose is to find information.
I think concept 3 (action) appears to be the most efficient. Is there any chance that there could be a beta for people(students/faculty) to see which one works better.
I like that concept 1 offers many stories of many people to represent the University. However, the simple links (which should be the main usability focus of the main page portal) are secondary to the 'distracting' main image.
Concept 3 is the most dramatic design-wise. It is clear and simple, yet bold. But most importantly, the links are boxed to make them stand out. That's what I care about the most. I just use the main page to get somewhere else (academic departments, search for people, registration, and library).
By the way, PLEASE PLEASE PLEASE add a link to "Registration" on the secondary page. It's very difficult to remember the term "Packtracks" - not very clear what the heck that is unless you've been here a couple of years.
I think that it should be taken into consideration that tons of students access the site everyday on campus through their PDA's. A huge amount of media on the homepage could make the page load super-slow for handheld users. The college of life and ag sciences (CALS) has an active handheld initiative so lots of users will be relying on the site to be friendly to their handheld.
The third concept has a much better navigational structure from the other designs. But. I feel the content emphasizes 'selling' the University to prospective students and their parents at the cost of reducing this portal's use to current students. It seems like all of these pages would be better suited for use on an admissions site. As a rising senior, I can tell you that the current page is only very occasionally interesting; the giant ACHIEVE link and other adverts are a mouse-trap when trying to get to useful information.
Another warning is to stay away from using stock photos. If the design is going to look fresh, it needs fresh content. Likewise, dynamic content should be updated frequently. STUDENT media sources (ie. Technician) would be an OK source. Take a look at the graphics on the (current) current students page. They're probably 8 years old, and it shows. Another key goal should be to reduce the number of links on the Students page. I estimate 75 links are there, in no particular arrangement. Simple web traffic analysis could tell you which pages need high-level links. Not every 'student program' needs a direct link from this page.
I beleive that concept 2 looks the best from those three choices. I don't like the action page because I believe the picture retains too much emphasis while the user may actually be searching for information, and not worried about the picture. If you want this site to be pleasing to those who are probably not going to use it that much, then #3 would be a good choice. But for functionality, #2 is the best, and it still has dynamic imagery to capture your attention... just not all of it
I feel option 3 is the most appealing. However, as a ncsu alum, I like option 1.
I'm a current senior at NC State and I think concept three is the most appealing design. I'm currently taking a web design english course and I believe the 3rd concept does a good job in captivating prospective audiences. I like that it's a bit simpler than the other designs without so many smaller photos which sort of distracting. Please use the 3rd concept and work from there. The other concepts are a bit too traditional and sort of unappealing to me. The last concept seems more up to date and similar to the simpler designs that are the trend in web design these days.
Concept 1: Oh please. Way too sappy.
Concept 2: Yawn. Zzzzz.
Concept 3: Bold, Brillant, Best! Hands down!
Concept 3 rocks! Great work guys. You're on your way to a great new site. :)
I like Concept 3- the best!!
definately concept 3 for me. It is a good combinatin of a number of elements together into one. Only comment is that the main image of the girl on top left could do with having her a bit happier.
I am definately for concept 3, action. In concept 1 the whole story theme will distract the visitor from what the institution can offer. In my opinion people are more interested in what they can get instead of what people have done. Whats wrong with combining the story element into concept 3?
Concept 1 looks very busy, in my opinion, but 2 and 3 look great! I think it is a toss up between the two but if you were to ask my opinion, I'd definitely go with three. I love the way that picture enhances the "feel" the site when compared to concept 2.
Concept 3 is the best :)
Tim Dillard
Concept 2 is the most professional of the bunch. I feel it has a nicer flow on the eyes, than the others.
Concept three is a winner. But, With all the graphics, will it take too long to load where people have slow connections?
As a prospective student, I have to say no. 3. It's easier to navigate and doesn't have so much crammed onto one page, which looks tacky!
Post a Comment
<< Home