So, my Design project is done (early, no less!). I elected to create a page from my final project, thus using this assignment to do some prototype work for the final project. Given the lessons I learned (see below), this is a Good Thing (apologies to Martha Stewart).
Things I’m proud of:
How the KDCB buttons work. These are on the right side of the page, and will serve as the primary navigation within the History section of the site. It’s a rollover button for CSS technique I found on the web. It’s an elegant solution and is easy to implement.
The notes in the text. While I don’t have any footnotes, I used Professor Petrick’s Sidenote 2 technique from her “Managing Endnotes & Footnotes” essay. I was able to get this to work (again), and I really like the way the additional information provided in the notes stays out of the way until it’s needed.
The header image. I really wanted to get my header image “outside the box” and I’ve very pleased at how it turned out. And even better, implementing the iepngfix.htc hack worked, too, so my hard work shows up in Internet Exploder, too. Good thing, since I’m sure 90% of the intended audience will be accessing this site in IE. If I’m lucky, it will be IE7 for most of them, but I’m sure that Microsoft will have a hand in most of the views.
Now, my lessons:
Just because you’ve done it once, don’t expect it to be easy to reproduce the effect again. Several of the techniques on my page were things that we’ve done in class throughout the semester. But I underestimated the time it takes to recreate these things when it’s (literally) been weeks since I last thought about it, much less practiced doing it in real code.
Start with a plan – the development phase is the wrong time to be doing design work. This is a lesson I’m personally embarrassed to re-learn – it’s in the day-to-day activities of what I do for a living, for crying out loud! I harp on “design then develop, design then develop” all the time. In spite of a sincere effort to think through the design of this page, much of the design is an organic outgrowth of the work I did, as I did it. I’d be creating a button and have an idea about how the buttons should be for a different navigation menu, necessitating going back and re-creating new buttons with a different theme. I would have saved several hours’ worth of work if I’d just thought it through a little more.
Line up your resources first – stopping to create new images, for instance, is a real drag on momentum. As much as I hate to admit it, I needed a project plan for this work. If my design had been more complete, I could have focused my time in Photoshop. That way I could have been banging out buttons and correcting images in quick succession, reinforcing the process with repetition and building up some momentum. As it happened, I jumped back and forth between XHTML/CSS code and Photoshop several times, and each time it took time to get back into the groove of each (very different) activity.
The devil’s in the details – keep a “punch list” of things that need to be fixed. This was actually something that I did right. I kept a running list of things I needed to fix as I went. That allowed me to stay focused on the current task without losing track of each little detail that needed attention. Several times, for instance, I started to work on trying to figure out the IE fix for showing PNG files. When I realized that I was getting off task, I was able to haul my attention back to the item I was working on and see it though to the end. I was even able to prioritize my punch list, so I focused on the “need-to” items and left the “want-to” things to the end. I eventually did tackle the PNG file issue (it works!), but only after I had completed all of the important things for getting the page to work in a standards-compliant browser.