We’re continuing the site’s new design based on wireframe D now and it’s looking good!
I thought I’d link to the designs here so you get a sneak peek of the direction we’re heading. This is still quite early and we plan to do formal reviews of the design here on the blog to get feedback/suggestions/comments, but I know everyone is curious about the new direction, so why wait?
Here are a few samples of the homepage template (NOTE: the homepage content is yet to be discussed in great detail — we’ve been focusing on the “shell” of the new site’s design which includes the top navigation, surrounding background elements, footer, and initial typography and color ideas):
- Homepage: This is what the user will see when they first get to ewu.edu
- Main navigation mouseover state: When the user mouses over a main navigation button, they’ll see a slightly lighter gray background (see the Admissions button in the upper left)
- Audience navigation mouseover state: When a user mouses over one of the audience links in the upper right, this menu will slide down (only after a slight delay though lest we annoy users with random popping up of unrequested menus) NOTE: Which links we use in these menus are still being worked out.
- Quicklinks mouseover state: This is what the user will see when they mouse over the QuickLinks tab. Note the “Customize…” link at the bottom. This link will take users to a page where they can decide what QuickLinks they’d like to have in that menu. The list will be computer-specific so will be handy for faculty/staff here on campus who use the same computer to frequently access certain areas of the EWU site.
- Auxiliary message layer: This area will only appear if users click the overhead screen handle present directly below the main navigation. We haven’t decided how this will look yet, but this is an initial idea. It is just another way for us to present as complete of a picture as we can about EWU and its surroundings through current regional data, photos, videos and potentially other social networking widgets.
There you have it! An initial look at the new design. Depending on the feedback we get with it, the design will evolve and probably change over the coming weeks but this should get you thinking about it (and hopefully a little excited too!). We’re working on internal page look & feel now (left navigation, content headers, etc.) so we’ll post those when the dust clears a little bit on the design.
Please feel free to leave comments!
Wow, what a sweet looking site you have there! The guy who’s designing it must be brilliant
Sam — I failed to attribute! Sam Buzby in Marketing & Communications is the head designer on this project. Though many of us have provided feedback and ideas along the way, Sam is responsible for the work on the visual design. So, Sam, nice work.
Colin, Kit, Alex, Betsy and myself will be working on the not-so-glamorous but still necessary code behind the scenes of this redesign. Though I’d love to post some of the code we’ll be writing for the project, I know it would probably bore 99.9% of you.
My hope is that a solid user interface that is fun and intuitive to use will be the reward for the hard work of the web programming team.
Thanks to everyone for their great work on this project so far! We’ve certainly got a long way to go, but we’ve got a good start under our belts!
The redesign does look very nice. I do have a concern about the black text on the darker red at the bottom of the page. I have to work to distinguish the words and my eyesight (with glasses) is better than some students and elderly who have visual impairments. Is there a way to make the text more readable?
What? No Papyrus? Nice work, Sam!
I think I agree with Doris’ concern… it’s a bit difficult to see. What about a white on gray (similar to the footer on http://wdn.unl.edu/)? My concern, initially, was with the amount of red used and the possibility of it appearing a bit abrasive. Maybe this would resolve both?
(**Disclaimer: I like design, but I don’t claim to be a designer
)
Wow! Impressive visual design. Like the rollover menus and web 2.0 bits on the gallery/weather/etc example page.
Huge improvement! I love it. Keep up the great work and thanks for all your efforts in bringing us this new cool design.
Thanks for the feedback folks!
@Doris: Great point, Doris. We’re wondering about that too and we’re toying around with some ideas on how to address it! Great to know other people expressed the same concern!
@cturnbull: We’re thinking about using Papyrus as the main font on the internal pages.
Just kidding of course… But yes, we are looking at the footer colors trying to determine what best to do. We are trying to avoid going too crimson & gray though (think other regional University near us with those colors….)….
@Patrick: Thanks for the feedback, Patrick!
@Erin: Thanks, Erin! And please keep commenting!
Along the lines of color, we will be testing the designs against color blindness too. http://colorfilter.wickline.org/
Sam & Ryan–
I like the look. I’m guessing the photos will change each time you log in. Will the events and news be pulled from GME or some other source? What about the calendar dates?
I agree the red along the bottom is too dark. I’d also like to see a larger font. And whom do I lobby for the library to have one of the big red buttons in the upper left (maybe where the Eagle Web Chronicle is currently located)?
@Julie: The plan for the large image area is to make it very versatile. I would guess that the majority of the time that area will be formatted similar to what you see in the mock-ups where its a DHTML rotator. It would rotate images and likely host other media files (Biola has a good working example on their home page). We are also allowing that entire middle area to be structured completely different if need be. So if we need to use the entire area including the space where the micro banners are right now, we will have that capability by inserting custom code into that area.
The events listing and mini calendar will be driven by the event calendar. We have already done the majority of the work to get the calendar ready but we will still need to apply the new design to it. It will be xml based like the rest of the site making the content reusable in several places, including the home page. The news will work similarly. I don’t think GME will be feeding the news… at least not initially. I’d like to elaborate a bit further on the event calendar, news and blogging in a blog post here soon. I just need to get permission to speak about a couple products before they’ve been officially announced by the vendor…its very exciting stuff.
Hi, guys.
Well, it certainly *looks* pretty slick and professional. I am very concerned about its functionality from a staff pt of view (which I recognize was not your charge, per se.) This has been a major hassle for the current CMS from the get-go–’what’s the magic word for this?’ ‘I can never find such-and-such page’…this kind of thing. And if units/depts change their name, Oh boy, what a mess. Will there be a “universal” change option so that a change you make ripples through all mentions of that dept/word for the whole site? Same comments about color and font as above.
The thing I really like is the Auxiliary pull down–it looks like a projector screen!
EM
Hi Elizabeth,
First I think it’s important to note, and it looks like you recognized this, that the home page will be presented in a way that really talks to a primary target audience, being prospective students. Also it’s important to note that, ultimately, much of the internal-use staff resources will be housed within an intranet site/portal. With that said, I think there are many changes coming with the redesign that address your concern for staff.
-The presentation of the audience based drop-down menus gives us room to accommodate a lot of links intended specifically for the audience.
-The “Quick Links” feature is customizable by the user so that should really benefit staff who frequent certain pages or site areas.
-The search should be much improved by using many Search Engine Optimization (SEO) techniques. Additionally, I’ve already worked out a site map feed for google that should help get new pages indexed quicker, modified pages re-indexed quicker, and deleted pages… um, “un-indexed” quicker. I’ve also worked out a search term mapping that will give us the ability to present “featured results” above all other results (eg. “calendar, “event calendar” and “calender”(sp) could all return the top result for the event calendar).
-The reworked site map and stuctured URLs should help enormously too… If you look at our current site tree now and think in terms of directory structure levels, we have pages that would be 10+ levels deep (ack!). If you were to apply “friendly” or structured URLs to those pages it would like ewu.edu/dir1/dir2/dir3/dir4/dir5/dir6/dir7/dir8/dir9/thepage. Obviously, that’s not very friendly. So the site tree, as it should, is becoming much shallower and laid out in a way that makes sense in terms of navigating the site and not so much in terms of University structure. Now when we apply structured URLs we should get URLs that make sense and are easier to remember.
-There hasn’t been any talk about the “Resources” link yet as seen in the home page preview. The intent of that area is to contain an audience-specific directory of sort which should be beneficial to staff.
I’m sure I’m missing a few points here so hopefully Ryan or someone else can add on.
As for a global change option, it depends on the case. When you change the title or name of a page, those changes will be changed globally in navigation links that reference the page. If there is text within the “Body Copy” of the page, the text will need to be manually updated…there’s just no getting around that. Using the proper search phrase in the CMS should return all of the pages that contain the word or phrase. If it’s a huge number of pages, we may have the option to write a script to do the replacement. We /do/ use some global text definitions that allow us to change certain text elements throughout the site but the text should be something that appears on at least the majority of the site’s pages (eg. footer text).
Pro:
I like the tabs/dropdown at the top.
Con:
I agree with others about the footer. Black lettering on red is unreadable.
Not that crazy about that much gray (reminds me of WSU), and the tan background in the events/news section isn’t that appealing to my eye.
I think you need to put more thought and testing on the main navigation/gray buttons and Quick Links. I disagree with Colin that the primary user of this site will only be prospective students. Do you really think that a lot of current EWU students/faculty/staff are going to never see this site and do all of their searching on the intranet? Has any institution gone this route successfully? And I’m willing to bet that a small percentage of people will bother customizing their quick links. Especially if you envision only non-EWU people bothering to use this page.
Therefore, I think that it’s important to come up with visible keywords for people to find what they are looking for, unless you want to force everyone to use the search box to find X. As the second most visited site on the CMS, I believe the library has earned a spot with Admissions, Academics, Athletics. etc. in the gray buttons. Especially if these gray buttons are going to be consistently used in secondary pages. And if I worked in the bookstore, I’d be rather upset that the keyword “bookstore” is nowhere on the site, despite the fact that it was the most frequently searched term.
What is “Gallery” – the art gallery, or somewhere to see pictures? If it’s the former, I’m sorry, but where’s your evidence that lots of people are looking for that. If it’s the latter, then I don’t think “gallery” is the keyword you want to use. And if these buttons are consistent throughout the pages, why would a picture gallery be as important as admissions, academics, athletics?
“Calendar” strikes me as more of a Quick Link, though maybe not if you broaden it out to News & Events.
What’s “Resources?” In the vein of “don’t make me think”, the term “Resources” tells me nothing. (And I’m very guilty of using this term all the time, but when I say “library resources” I do in fact mean everything the library has. So “Resources” means to me the entire EWU site.)
@Ielleen: Thanks for your great feedback! Much appreciated! I’ll respond to a few of your questions individually below:
–”I disagree with Colin that the primary user of this site will only be prospective students.”
Firstly, that’s not what I said above… I said that the home page would be presented in a way that talks to prospective students. I think that’s hard to argue with that based on the research that was done. In our research, probably the most common theme that came out between all audiences we talked to (both internally *and* externally) was that the site’s number one target audience should be prospective students. We fully understand that we’re not *only* talking to prospective students, which is why we’ve completely broken audiences out in the upper right with very versatile and powerful dropdown navigation. We’re also spending a great deal of time trying to understand how to best present internal information through the external site as well.
–”Do you really think that a lot of current EWU students/faculty/staff are going to never see this site and do all of their searching on the intranet? Has any institution gone this route successfully? And I’m willing to bet that a small percentage of people will bother customizing their quick links.”
We definitely know that the external site will be referenced by internal audiences, especially since the intranet will not be complete in time to transition internal use content prior launching the new site. There is a great amount of content on our external site currently that should belong exclusively to an intranet site for the University. Forms, documents, schedules, internally targeted communication, etc. will have a much stronger sense of place on an intranet than they do on the external site. And the tools for accessing this content that will be made available through the intranet will be much more robust and capable than our external site can accomplish. Many Universities throughout the country have begun to take this route. If you look at the roster of those universities using portal/intranet software right now, it’s a fairly extensive list. As far as institutions in general, I’d be willing to say that almost every large institution in the world has both an internal and external site, and in many cases internal parties do eventually end up very rarely looking at the external site. We recognize that this probably won’t be something that’s immediately workable at EWU, but it is convention for large organizations to implement this kind of branched communication form. As for the quicklinks, we had this feature requested in our research. We definitely understand that it is auxiliary navigation and so we were able to incorporate it in a way that is not too obtrusive yet a natural part of the page flow. Virginia Tech uses a similar technique successfully. We see this technique as a potentially low input/high output scenario where it doesn’t take a lot of resources to build the feature and could yield valuable results to our internal audiences. If we find through analytics that isn’t being used, we will consider de-scoping it from the site.
–”Therefore, I think that it’s important to come up with visible keywords for people to find what they are looking for, unless you want to force everyone to use the search box to find X.”
I’m curious to know what your thoughts are on examples for these keywords. Could you please elaborate a bit?
–”As the second most visited site on the CMS, I believe the library has earned a spot with Admissions, Academics, Athletics. etc. in the gray buttons. Especially if these gray buttons are going to be consistently used in secondary pages.”
We recognize the importance of the library in the University landscape, but since it represents what we term “functional” navigation meaning that a user knows exactly what they’re looking for when they go to the library website (similar to the footer links for jobs, EagleNET, Blackboard, etc.), this type of navigation is best found in the site footer, available globally throughout the site. Indeed, the library link will also be available under the audience dropdowns and quicklinks as part of the main navigation.
–”And if I worked in the bookstore, I’d be rather upset that the keyword “bookstore” is nowhere on the site, despite the fact that it was the most frequently searched term.”
You bring up a good point about the bookstore. We did have it in the footer for a while and then decided that it would have its place in the quicklinks area and also in the audience dropdowns available globally throughout the site. Though it isn’t visible immediately as the page loads, studies have shown that users aren’t afraid to use dropdown navigation like this to find the info they’re looking for.
–”What is “Gallery” – the art gallery, or somewhere to see pictures? If it’s the former, I’m sorry, but where’s your evidence that lots of people are looking for that. If it’s the latter, then I don’t think “gallery” is the keyword you want to use. And if these buttons are consistent throughout the pages, why would a picture gallery be as important as admissions, academics, athletics?”
Gallery will have multiple meanings in its final use, but in your example it’s closer to the latter. We’re still working out all the details around that, but essentially it will be a spot for the University to flex its muscles for multiple audiences. Think of it as our trophy case essentially. Not only will we have available under there photos and videos for users to watch about the University in general, but we also plan to have information under there about featured programs, research, students, faculty, staff, etc. to entice, excite and connect with multiple types of users. The design of this area of the site will be critical to its success, but our research has shown (again, both with internal and external audiences) that this is an area of the EWU site that is sorely missing currently.
–”"Calendar” strikes me as more of a Quick Link, though maybe not if you broaden it out to News & Events.”
Calendar was another one of those very frequently requested features for the EWU site. Best practices have shown that a calendar readily available throughout the site through global navigation is effective. Your suggestion about combining it into News & Events is definitely worth consideration though!
–”What’s “Resources?” In the vein of “don’t make me think”, the term “Resources” tells me nothing.”
Admittedly, “Resources” is a tough term, but we’ve recognized the need for a central repository for audience-driven functional information on the site. Many times, the data we have on our site doesn’t necessarily fit into a neat bucket (e.g., what category do you put Parking under?) so this is an area where we’d organize that information and present in a fashion that people can understand easily based on audience and/or University structure. If you have a synonym for Resources or something that would be more descriptive but still short, we’re certainly open to suggestions!
Hi Ryan:
Thanks for facilitating this discussion.
The heavy drop shadows, and side tabs on the home page are a bit distracting.
As an example, the EagleNet home page is very simple and clean, easy to read.
A simple border around the home page frame is easier to look at and navigate.
But then again, I am a minimalist.
LC
EagleNet url:
http://eaglenet.ewu.edu/
Hi Larry,
Thanks for your feedback, we have heard a few similar comments about the heavy drop shadows and are addressing them in the next “sneak peek” that should be posted soon. I think you’ll like the changes we’ve made since posting the concept to which you are referring.
Thanks again, keep the comments coming!
Sam
hmmm