Entries Tagged 'design' ↓

What’s Wrong with our Home Page

I am going to go out on a limb and speak to something that gnaws at me regularly. You know, that kind of staying up at night wondering about the conversation you COULD have had if you had the presence of mind, or the courage, to have had it. Believe it or not (for those who have worked with me and know how obnoxiously outspoken I can be), I do hold back my opinions a lot for many reasons, mostly related to job security :) But things gnaw at me sometimes nonetheless, and I’ve reached a point of feeling like I’m doing a disservice to UMW without raising an issue. So, consider this issue raised.

Steve Greenlaw (one of our more outstanding faculty members, in case you didn’t know) sent me a link yesterday to a story about the new home page for Ozarks Technical Community College (screenshot below):

This hearkened back to a conversation I had with DTLT years ago. Jerry Slezak (another UMW hero/genius now leading Information Technology Services) suggested at the time, as we went round and round with discussions of home page designs for the new Teaching Center, simply suggested that a search box would be the most effective tool to get people to what they want. We joked about simply redirecting our umw.edu url to Google — that it would be more efficent.

This is a seductive idea which places efficiency above all, and gives the driver’s seat over to the site visitor completely. Indeed, designing home page navigation is a crap shoot at best, frequently driven by internal politics and assumptions about “what students are looking for.” And, believe me, at UMW, I have learned that students are looking for whatever the content is that a particular stakeholder comes to me to complain about not being sufficiently visible on the home page :) Okay, I’m being harsh, but there is more appeasement than design, more compromise than art, more smoke/mirrors than science, involved in this notion of a “splash page” to introduce the University to the wider world. It’s just a fact.

Knowing this, I can see where the Ozarks folks may have arrived at this solution. They used actual science — the stats on how folks navigated their site using primarily the search box — to inform their bold choice. But, although clever and efficient, I am not so sure about its utility at a more complex institution with multiple colleges, where programs may have similar names, and  where content creators are highly decentralized, as they are at most larger institutions (and at UMW). That’s putting an awful lot of faith in your search algorithm, Google search or otherwise, as well as in the ability of the content creators to get the right stuff in the right places, and then have the metrics bear out so that the most relevant stuff in the more obscure categories of information come out on top. I think this could have been effective at Mary Washington College prior to 1999, when the Stafford campus opened and introduced a set of redundant content owners, more than one campus, degree program and prospective student audience. Search for “registering for classes” and you could have been sent anywhere because there were dual functions on both campuses.

When I came along in 2001, sorting through the redundant content on the James Monroe Center site, and having endless arguments about who owned what function (read: web content) became a staple argument that kept on going until CGPS became a campus, and organization of student service functions was better defined. If there had been only a search box for a home page during those days, I honestly don’t know if the phones ever would have stopped ringing with complaints and confusion.

Assuming my above argument addresses why the home-page-as-search-box model may not work for UMW from an efficiency/customer service standpoint, what exactly is the beef I have with the more conventional home page we now have? In a word: SEO relevance. Ask any SEO (search engine optimization) expert (and the world is LOUSY with them these days) what is the number one way to move your rankings up and keep them up and they will tell you: CONSTANTLY CHANGING CONTENT THAT IS CONSIDERED RELEVANT BY RECOGNIZED AUTHORITATIVE WEB SITES. Period.

Here’s where I lose my job: For all of our redesigning, we have bowed to the pressure of the print-design mentality of a nice “cover” to our university that will succinctly capture the essence of UMW. We argue about the brand platform elements, and how the images and their captions convey a message about the Great Minds brand. We are not serving the needs of our SEO, but of a good print marketing campaign: consistent messages. SEO does not care about consistent marketing messages — it cares about interesting, dynamic content competing for daily air-time with larger institutions. Google doesn’t care that we are a liberal arts institution and we are awesome. It cares about what we are doing NOW, TODAY, and whether it’s any different from last week. Because if it’s not, our rank drops.

Google does not rank our home page based on whether the picture of that student and a pithy caption capture our essence. It cares if the picture of that student is essentially a headline about NEW story, posted as a newspaper would post a story, dated and attributed to an author. It cares that we regularly have new stories featured in the main content area which, for all intents and purposes, is our big photo rotation area.

Do we have news releases? Yes, but they are at the bottom of the page. Would they make great splash photos? Well, mostly not, because what it takes to get a great splash photo is a photo journalist on staff 24/7 who can capture incidents as they happen in high-quality images. High-quality images mean waiting for our once-a-month photographer to take photos of features that are scheduled ahead of time. The images that come out of breaking news are frequently stock photos of faculty, or of campus, because it’s what we have.

So, what am I saying? Well, perhaps it’s that where I don’t think a single search box would work, I’m not convinced that coming to a home page with a big-honkin’ image and caption is really useful from a user, or SEO, perspective. And I wish I had the nerve to say it when we were doing our re-design. But, the beauty of the web is that it’s fungible. If we have courage, we can tear this thing up and do it again.

In essence, I would like to see less print-think both in design AND in maintenance of our site. Constant changing home page content is not constantly updated canned photos and captions — it’s actual stuff going on day-to-day. Which gets to UMW Blogs and our new faculty content aggregator — who knows what up-to-the-minute content we’ll have access to in a few months? Our home page could actually look less like a book cover, and more like an open book. Ain’t that higher ed anyway?

Slide Guy Adventurer!

I simply could not resist the Slide Guy assignment. It’s my chance to show Tim Owens at his best, whether running the bulls in Pamplona:

Tim Owens at the Running of the Bulls, Pamplona, Spain

Or, when he was on that “extreme skiing” adventure:

Tim Owens doing some Extreme Skiing without equipment.

Go Timmmmyboy!

Adventures in Creating an Online Alter Ego

For DS106′s Camp Magic Macguffin semester, I have created an alter ego online so that I can engage in an alternate narrative that  does not bind me to my own online history. All of my online activity vis-a-vis DS106 need to appear to emanate from this person. Having managed permissions on large CMS systems in the past, including Sharepoint, I figured no problem, right? Well, there are no problems, except in my apparent inability to grok the ramifications of what I’m doing. But, that’s what online learning is about, trial, error, trial, error, tear out hair, more error. Eventual solution. Trial, error…

As I fix one thing to make sure that I’ve covered my tracks, another one has popped up. Here is a favorite scene from Abbott and Costello that haunts me during these kinds of experiences (unless YouTube stops me):

With that in mind, here are a few lessons I’m learning. By the way, I performed all of the following steps in the wrong order. What I’m hoping to tell you is how to do it right so you don’t experience what Lou is experiencing above:

1) Start with WordPress.com: You’ll want to create a new WordPress.com account. If you already have one, create a new one with an alternate email address and identity. In my case, I used my Yahoo! account email, and then forwarded that to my Gmail account. These days, by the way, Yahoo! charges you $20 per year to forward. I think they’ve caught on about this new Google thing…

2) Gravatar: Associate your alternate email address with your WordPress identity and upload a new gravatar.

3) Twitter: Create a new Twitter account, and use the same image you used for your gravatar.

4) Soundcloud and other services: Associate them with your Gravatar email account, and your Gravatar identity should carry through.

5) DS106: I needed to create an additional account on DS106 associated with my new identity.

6) Be Mindful: I have to keep mindful of logging into this and that with the right identity. I’ve slipped up more than once, and will no doubt continue to do so, which is part of the fun. The character is in service to the narrative, not to me, so if I mess up, it’s possible that this can be woven into the narrative in some way. I’m not worried, unless I apply for a job somewhere and someone asks me something like, “It says here that you are an unemployed music teacher with a drinking problem who is obsessed with guarding her footlocker. What do you think these experiences could help you bring to this position?”

I’m sure I’m still doing it wrong, and that there are other steps of which I need to be mindful. If you have any suggestions, or have other experiences with online identities that may help, I’m all ears.

 

 

 

Crossing the Academic – Administrative Blood-Brain Barrier.

Brain

I had a great conversation yesterday with a faculty member. She later read my recent blog post regarding the need for us to leap beyond our idea of the web as a technology component of our jobs, and to see it more as students see it, which is an integral part of their lives. The faculty member reminded me that administrative staff do not always have day-to-day contact with students in a way that develops relationships and nurtures understanding. Faculty have that opportunity, but staff may or may not depending on their position. As a result, it may be asking a lot for staff to keep up with what students know and do in their everyday lives, contributing to communicative silos and reliance on the way things have always been done. I know for myself that I have very little contact with students, and rely on my academic friends, and daily reading, to keep as up to date as I can.

Her response helped to kick me out of my judgmental state of mind and back into the truth for a lot of our administrative staff, many of whom manage the majority of web sites within the UMW public web presence. Now, where to go with that.

During my years at Lippincott in the 1990s, I learned a lot about effective communications. I learned that a communications plan is NOT an implementation plan — the latter is a component of the former. But, the way we have traditionally trained our web administrators is during the implementation phase. In short, they are taught how to use the tools to do a web page. First Netscape Composer, then Dreamweaver, Contribute, and now WordPress. Although we spent a good deal of time during the Dreamweaver days speaking to information architecture, the current notion of interactive design is so very new, and involves a higher level of sophistication than our training now embodies.

This is largely the result of a lack of time and resources. However, it also points to a myopia of mine, and a fear of mine, in this regard. First, the myopia.

There is so much work that goes into migrating a web system, many late nights, many lines of code, lots of photoshop, meetings, emails, and error de-bugging. My self-imposed silo says “of course everyone is thinking what I’m thinking about the potential of this.” Which, of course, who can? I’m not thinking about Banner course data either (although I know a few folks at the registrar who are consumed with that day in and day out). The point is, these folks have a job, and it’s not mine. So, strike one against me.

Now for the fear I have: Folks within their “silos” feel they command a strong understanding of their audiences, and I hesitate to be an interloper in that. However, as technology becomes more and more ubiquitous and mobile among our students, I fear that there is no administrative staff member who can possibly understand the way students today inhabit technology. I have trouble keeping up with DTLT who are probably the best at keeping up, and that’s THEIR ENTIRE JOB — to not only keep up, but push the edges.

Since 2001 (when I first took this job), the paradigm of the job description for a website administrator has been, essentially, a tacked-on duty in an EWP — we have had few (if any) employees in functional areas whose sole job it is to manage electronic communications with their audiences. Electronic communications involves so much more than it did then. Once confined to email and websites, it’s now one-to-many, many-to-many interaction in multiple directions.

So, how to raise my consciousness and the consciousness of those who need to effectively engage audiences and efficiently exchange information within the media that our students inhabit? Now that the WordPress-as-a-tool horse is out of the barn, how do we train those using it to not just have pretty sites (which is NOT an end goal), but to be masters of their information domain and key contact points for students?

Absent staffing specialists, I believe that this poses a new opportunity for training not on the tool, but on how to inhabit the online space. To that end, I propose the folllowing:

1) DS106: Every staff member who is a website administrator can be required to submit at least one DS106 assignment (which may get them addicted). This should count as a professional development activity. The advantage of this approach is that it costs the university nothing in person hours or resources. It’s our own online, hetergeneous community where people can opt in to join a community learning how to communicate within a networked, online environment. The experience will give staff members not only practice in the core principal of online storytelling, but make them part of a community of students who are using the web the way many students are and WILL use the web to create and express ideas. It makes the staff member PART of that community, instead of only reading about it in the Chronicle :)

2) Supervisors Should Require Department Web Administrators to attend Faculty Academy: This year, Faculty Academy is being held on the Fredericksburg campus. For staff members who don’t know about it, it’s an annual FREE conference at UMW that attracts the best-of-the-best speakers in the field of teaching and learning technologies. Although staff members are not in the business of teaching courses for credit, web administrators ARE in the business of teaching students all they need to know to negotiate their college careers during our time here. Techniques used by faculty and instructional technologists are very easily translated into the administrative environment. Indeed, the beginnings of higher education online environments were largely in libraries, so, there is ample history for this notion of cross-pollination. And where do you think we got the idea for WordPress in the first place (HINT: umwblogs.org). Register for Faculty Academy NOW – the deadline is May 11! This should count as a professional development activity.

3) Group Usability Sessions: Conducted by my office, groups of web administrators will be asked to perform a usability test from a student’s point of view on another department’s website and report anonymously. They will be given a series of interactions that a current student needs to perform at UMW, and to see how effectively that student can achieve their goal in a set period of time. This can be done online or in a lab together. I like the idea of doing it online so people can do it in their own time and not feel observed by others. We can then have an online session together to discuss what principles we learned from the exercise.

4) Group Mobile Usability Sessions: Brian Fling of pinch/zoom, an internationally-recognized mobile developer, emphasizes the importance of putting mobile front and center as the PRIMARY means by which we will get information in the future. As a result, the student’s experience of mobile is much more important to them than it may be to many of us, and this will only increase over time. Although we have a way to graphically adjust our sites for mobile using a plugin called WPTouch pro, and although there are more dynamic ways (called “responsive design“) to achieve layout flexibility it is not so simple as a layout change. Mobile is a different experience altogether. In a usability test that Fling did for a BBC site that was supposed to promote their programming, he observed this:

“Users felt that they were in control of their iPad, that it was THEIRS, and that this experience — you granted them access to their brains, their eyes, and they took that trust very seriously. So they said that if they were feeling that they were overly marketed to, that they would remove, close, or delete any sort of application that they perceived to be as marketing and advertising activity. We’d never seen users in a lab session feel so strongly about being marketed to.”

Testing each other’s sites on iPads and iPhones may elicit some interesting discussion about what our department home pages now do from a design perspective (much improved), and what they now don’t do from an interaction perspective (not so good). It’s a new metric for measuring success, and something we need to get a command of.

All this is to say that, to the extent that I am currently frustrated with our level of consciousness about online content, I am equally eager to help raise it (and my own along with it).

Photo: Scan depicting blood/brain barrier (by: Christopher Lewis)

Interactive Map Beta Test Results

We got the new UMW Interactive Map live enough for a beta test, and have been getting very constructive feedback from faculty and staff. If you’d like to test drive it yourself, visit http://tour.umw.edu. Then, when you’ve had a chance to play around with it, send us your comments by clicking on “Provide Feedback” in the lower left hand corner.

To keep this process as transparent as possible, I’d like to provide you with the response data as well as what we have done in response to the responses :)

Summary Report – April 6, 2012 – UMW Interactive Map Beta Test

It would appear that we are largely on the right track, but this has helped us to prioritize what we are doing first. We are on track to launch the beginnings of the live interactive map for outside users within the next two weeks. It is intended to be an iterative, ongoing project, and we look to have community input throughout the life of this application. We would even welcome offers to develop new features for this as a platform, should anyone be interested in participating. Here are the comments and our responses to them so far.

Building plans with room #’s, etc.

We do not have the data to accomplish this at this point. This is something that would be helpful in an enterprise calendaring system, but beyond this application.

Great job

Thank you!

Pictures associated with each location.

Done.

Some elements do not seem to render well in Chrome.

If you can tell us which ones, that would help. We use Chrome as our primary development browser and have not seen anything so far, but please give us details.

The map is cluttered and hard to read on a mobile device. Images or partially display.

We are reducing the size of the bottom bar and replacing icons with small pins.

no ideas

That’s okay!

we need a picture of the economics house, 1004 college ave.

Done.

It would be helpful to actually list Lee Hall on the map. (There are only symbols for the departments on the map at this time.

It’s there. You can hopefully see it now that all the icons are gone!

This is a nifty little tool! It located me right away, and correctly, from my laptop. I noticed a couple things as I was navigating: 1) The “see more” button on the Seaco description is messed up – it takes out only half of a sentence in the middle of the text block. 2) Lee Hall is not labeled on the actual map as the other buildings are. (Could be important for new students!) 3) Center for International Education is not included in the description of services in Lee Hall. Great work on this! It’ll be great to see additional photos go up. It’ll be a useful tool for visitors and new students alike.

Let us know the browser you are using. Lee hall is now visible (see above). CIE is now there. More photos are there, and we are planning on a photo upload feature for future.

Just what I said before. How to get to these buildings is not clear. How can you walk from Dodd to the Library? Well done! The fountains are not pictured… I like how you added trees.

We are writing a script to calculate distances from your location to the building you’re looking at. This will be down the road – more development time needed.

Would like to see the building as you scroll over it w/o having to click on it. HATE icons. Had no idea what a few were until I clicked on them.

Got rid of the icons. Not sure that “hover” would not be annoying as the buildings are close together on a mobile device.

I think the map is wonderful, and a fantastic idea. The pictures are beautiful, the map and details are very helpful. Since you asked for constructive criticism, I did take a second look at the map with a more critical eye. When I click on the Bookstore, the details never tell me that the Bookstore is located IN Lee Hall. Folks might be looking for a separate Bookstore building. The picture of the Eagle Village Shops should be taken from the corner of College and Route 1 so that Home Team Grill and the restaurants in the front are shown. I think Home Team is trying very hard to show support for UMW by displaying UMW apparel and team things. You really can’t see the shops/restaurants in the current picture.

1) Bookstore description now mentions Lee Hall; 2) We definitely need better pictures of the Eagle Village shops and will get them!

My only suggestion would be to include the UMW Bookstore web address on the details page for the Bookstore. This would allow people to search for branded clothing and textbooks.

Done.

The description of Randolph Hall has a typo, centrally is spelled entrally. The description of Marye House should indicate that it houses, Student Life, Judicial Affairs and Community Responsibility and The Office of Residence Life and Commuter Student Services.

1) Typo fixed; 2) Departments added to Marye House, with picture.

Newer buildings, such as Eagle Landing and the Dahlgren Campus, don’t show up on satellite view. While we wait for Google to update their imagery, perhaps outlines of the buildings could be overlaid on the satellite view?

We will see if these “kml” files can be imposed on the satellite view. This is based on the Google Maps API and we’d have to see if that is possible. It’s a great idea. Waiting for Google Maps to update can be very frustrating.

Right now, I either have to punch “show all” or look at one subgroup at a time like academic buildings OR residence halls. There doesn’t seem to be an option to look at two or three subgroups at a time, like residence halls AND academic buildings, without having to look at all campus buildings. Will that be an option in the future? Also, any plans to add a function that estimates walking distance/time between points on the map? Or shows the best handicapped accessible route between two points?

We are looking into this and agree with you. We are also researching scripts to calculate distances (as the bird flies) between the user’s mobile location and their destination. Adding accessibility information is important. Right now, we can add it as a narrative in the content and it’s on our “to-do” list. Thank you!

It would be helpful to have the Anderson Center named, instead of “gymnasium” as the Graduate Commencement will be held there.

The names of all the buildings are on Google Maps. We are researching if we can overlay a label, but may not be able to do this before launch.

Anderson Center now seats 1700 for basketball / volleyball games; check with Ed Hegmann for exact figures

Made the change.

Good map. Somewhat difficult to see on my iPhone until I sized it. Still the building icons appear large in relation to the building.

Replaced icons (see above).

Not sure the PDF walking tour adds a whole lot, would be better to have tours laid out on maps, with information linked. Also, on iPhone the bars for the labels (Dashboard, PDF Map) take up large amount of space, might be better if possible, to make them less height on screen

Agree. We’re canning the walking tour since it’s old anyway. We are reducing the bottom bar size.

I think also listing the other buildings that are close when you click on the detail link, will help new staff and students reference their location on campus better. Also a “where do you want to go” search from the building details would be helpful.

This is an interesting idea. Since we are looking for ways to calculate distance, we can see if this can be applied to the function you mention.

Some departments in Student Services were excluded – Student Accounts, Financial Aid and Parking Management. These departments should be included with the others listed as well.

These departments are now in there.

The images seem random and some buildings have no image at all. It might be more appropriate to have the map navigation then allow building navigation in this way the map could be a navigational tool where the user could start at any level of detail.

We’ve added a lot more images and will continue to improve on them. Getting images for every building has proven to be a very large challenge. Hopefully when we allow user image uploads, this will add to the life and texture of the images. Right now, they are intended to be more informational than beautiful.

I would make sure to describe the parking areas better. Ensure that visitors know where they are able to park. Some of the descriptions are still blank.

We filled in the blank ones and linked all of them to the Parking Management website. Having that info reside in the tour itself would be hard to maintain since policies change over time.

More detailed text in regard to parking areas. In particular areas that are often reserved for events, GW lot for example. Also interested in sidewalks for those visitors walking to Lee for example.

See above abour parking. To show sidewalks and the campus walk would be a monumental effort unless we can get shapefiles plotted for these areas. The Geography students and Professor Brian Rizzo assisted us with shapefiles for the newer buildings. I am not sure if they exist for the sidewalks, but I’m willing to check with the city to find out. We were also dismayed that the Google Directions can only work along roadways that they know about. So, giving directions to the Dahlgren Campus is impossible on Google right now. The roads don’t even exist!

I think having an interactive campus map is very important and I applaud the work being done. Some concerns/recommendations stem around overall web accessibility and how we can best design workarounds within this framework. Such as: alt tagging over pictures used so a screen reader can pick those up (not necessarily using flash based image), having an identifiable text key with all the campus buildings, etc that will be displayed visually, if color is of importance, making sure this is written out as well.

The map is not in flash and is entirely HTML and Javascript based. There is a text-only version that loads automatically on browsers that cannot parse the map. Blackberry users see this version. It is at http://tour.umw.edu/location-list.

Also, I am working now on adding alt tags where they are missing – good call. I was being too fast with the data entry!

The building name labels are blocked by the icons which makes it difficult to find buildings. The Events Office would love to use this map for events – if there would be a way to customize it for an event such as Family Weekend to let people know where each event is that would be a great feature.

We have removed the icons, replacing them with small map pins. There is a satellite option in the dashboard.

Offer a map option for a satellite view in addition the the drawing view – similar to the Google maps option

This is available in the dashboard.

Phone # in “details” text of UMW Bookstore very helpful as quick reference at end; add to others?

A maintenance headache, unfortunately. Because these numbers are maintained in Banner in a different way than we need them on the tour, it would have to be done manually, and we just don’t have the personnel to manage that.

Add a “gathering space” icon to Jefferson square; and the lawn between Mason/Randolph once open.

Added to Jefferson Square. Will add to Randoph/Mason in the fall after it opens.

 

 

Charette

It was 1979 when I first learned the concept of “charette.” It was orientation at my first semester at Parsons, and we were scared straight by the department chair about what design school would be like. All-nighters would be a regular thing, some of us would graduate to make big bucks, most of us would make a living, some of us would struggle. The term “charette” was used at the Beaux Arts to describe this frantic rush to meet a deadline for a “crit” (critique, when they’d tear your work apart in front of everyone). The word apparently means “on the cart,” evoking an image of working while running towards the studio to pin up your drawings. We were told that although this would be physically demanding, it was imperative that, as designers of the environment, we should remain “awake” and focused, no matter how blurry our minds from the sleep deprivation.

After the lecture from the chair, a group of us got into the elevator, and the chair accompanied us. No one pressed the button, and he admonished us that “if we were awake, we would have known to press the button.” This guy was harsh, no doubt about it, but this concept of being awake and aware of the details stuck with me. It kind of gave a purpose to my usual racing thoughts and unending stream of consciousness of seemingly disjointed ideas that always seemed to add up to something, but I wasn’t really sure.

The chair didn’t lie. The next three years were a bit of a blur running all over Manhattan for the late Sunday-night supplies at Sam Flax. Surrounded by tourists with subway maps and kids, you’d be on the R train on a Sunday morning not having slept the night before, heading to Canal street to buy some model plastic and solvent glue, wondering what the parallel universe of “recreation” must be like. I wondered if my life would always find me trudging through crowded trains not having showered that day, with wooden building models,hoping they don’t break on my way to a presentation, hoping my blueprints wouldn’t delaminate from the poster board, hoping that I could afford to pay for the the contact negatives of my pencil drawings.

I wistfully now go through another charette. I’m walking around with that ashy-skin look, dark circles, messy hair, laundry to the ceiling, no spare emotional parts. Back to 4-5 hours per sleep per night (hey, I’ve got little kids, and I’m 52 and that’s as close to an all-nighter as I can get), I’m again in that parallel universe where I watch other folks “go to lunch” or the gym, and it feels like a million years since I’ve done anything remotely resembling that.

There are no more building models, plastic, solvent glue, ammonia-riddled blueprints — I carry only a laptop these days. But the worries, and the process, are the same. Iterate, iterate, iterate through every detail, back up to the concept, back down to the details, like you’re swimming the butterfly stroke to the finish with your eyes open all the way.