Lake Michigan College is a relatively small and old community college located in beautiful Southwest Michigan. Founded in the period following the second world war, it has served to prepare individuals for the eventual transition to a four year institution, technical training, or for the completion of several different degree paths. It has become an integral part of the area’s success in many ways, mainly because of the pool of trained workers it provides local business.
For this reason, it is important to ensure the public can access information about opportunities at the college. In some ways they’ve worked towards this goal, but they can do better.
I’ve been a student at Lake Michigan College in the past and at the time found the website to be very frustrating to use as as a resource; this is perhaps a little less true now than when I attended, however, judging by my explorations of the site, the experience has only improved marginally in that the IA is a bit troublesome and the overall experience is a bit overwhelming visually.
My First Observations
The current site is a bit of a mystery to me. It appears to be run on the Joomla CMS, which in my mind is perhaps a little strange for a college of this size, though I can understand the appeal of open source (hello WordPress!); but what gets me is the URL structure of the site. You end up with a very long query string on the end, e.g. index.php?id=3342&Itemid=13. This creates a bit of a mess in terms of SEO, though their interests may be focused primarily on the front page. I find it hard to believe that they wouldn’t be interested in such a small but crucial part of their overall SEO strategy. From my small bit of research, it appears that enabling search engine friendly URLs in Joomla is relatively simple, though perhaps their server capabilities prevent it.
The front page focus is pretty evident when you browse the site, as EVERYTHING is located on the front page, gladly not all shoved “above the fold.” This might not be as much of a problem, but the various elements on this page have no evident unified structure or design to speak of. This is a bit chaotic, and can overwhelm the user with choice. It really is unnecessarily busy. In an organization like this, there are probably many competing factors going into the design decisions, though a more organized approach would help to increase ease of use for students.
Lastly, and this is really the part I like best, the drop down menus have markedly improved from the version preceding it, though this menu is not without its faults. The drop down menus on the site are a bit overwhelming in terms of how much choice an individual has, and in some cases choices are duplicated across a few different drop downs. While this structure has served to make it easier in relation to previous versions, the IA could use a great deal of work in order to simplify things for users.
First and foremost, I’m really only proposing one possible solution of many. I wanted to capture what makes LMC great for this community, and remind folks that it is an affordable institution, close to home, ready to get you the training you need.
To do that, I wanted to update the logo–but only slightly. Perhaps giving it just a little refinement in terms of type treatment, and in process ensuring any updates I made remained true to the college’s current identity. In a lot of ways that identity has a great deal of traction around here, and it would be a mistake to ignore that.
Current Logo on the left, my proposed update on the right.
My first decision was to simplify the logo mark as much as possible while retaining it’s character. This was relatively easy to accomplish as I eliminated the border surrounding the mark, ensuring only the most important aspects of it remained. To my eye, this cleaned it up significantly.
My second decision was to refine the type; I’m not entirely sure what the typeface is for “Lake Michigan,” but it appears to be warped out of it’s designed ratios. This isn’t a particularly good practice as it can hinder legibility. In this case, it might not, but to get a good handle on its subtleties I needed to use a typeface I was mildly familiar with. I chose Jenson as an appropriate substitution for the serif and retained the small caps format, albeit a little more exaggerated. I wanted to set “College” apart, as it seems to be of secondary consideration in the overall scheme. I chose a sans-serif face, Futura, that would add a bit of distinction and would be appropriate to carry over into the rest of the web site.
Overall, the quality isn’t there quite yet, but the direction is obvious. A more refined logo mark and type treatment could go a long way towards polishing the college’s image. My ideas here are only a beginning, a possible direction, but I would like to see the institution refine an already well-known local brand.
The New Web Site
As discussed earlier, the current site is a bit of a mess, and my whole approach was designed to refine it and make things simpler for the user. After doing some studying of the current site I came up with a rough structure that I thought would help to address the needs of future and current students a little bit better by paring down some of the menu bloat that was evident before. Also, I wanted to clean up the front page in general, as there were a lot of different elements that served as distraction rather than as useful information. My focus in this redesign is to make it easier for prospective and current students to navigate the site and find what they’re looking for.
There was a lot happening in the current site that helped to focus attention away from primary content. Colors were one of those distractions in my view. There was no real coherence to the color decisions that were made and their actual branding materials, something a casual reader or browser might not be aware of. There is a great deal of red throughout their printed materials; in fact, school colors are red and gray, so color decisions were pretty simple. I decided to limit colors on the site for this rough mockup to red, gray, and black. Hopefully this will help to keep one’s attention on relevant information and aid user’s in deciphering the interface a bit better. And, more importantly, keeping a coherent branded message across all mediums.
Additionally, I wanted to re-purpose the, what I’ll call, pictographic highlight at the top of the site. Currently it’s a an image rotator, with no real purpose in terms of what it provides the user, yet it takes up a rather large portion of the screen. In order to take advantage of an element that could provide great photography, but also be useful, I decided it would be the perfect way to highlight some aspect of the campus that might interest a prospective student.
Overall the mockup is a solution designed to aid in the navigation of the site, create a more obvious information hierarchy, and hopefully address some of the underlying problems with the current site.
This isn’t an end all approach, but one solution of many based on my understanding of the needs of the possible users of this site. The aim was to improve upon, rather than to prove something about, the inadequacies of the current site; hopefully this helped to address them in some small way, and ultimately will get you thinking about the possibilities of a well planned site design.