Example Design Project -- The Band
May 27, 2004 | 
41 Comments
So I’ve had this idea for awhile. I’ve wanted to do another Web design example project, this time for a fictional band. I really want to show that it’s possible to make a killer band site that looks cool and is very easy to use as well.
As I’ve talked about before (somewhere in my People-centric Web post), it’s pretty rare for these kind of sites to be usable.
I’ve been waiting to start on this until a few projects clear up and summer was here.
Well, summer is almost here and my projects are almost cleared up. I’m planning on taking the summer mostly off from freelancing to have a little fun and relax a bit. You all know I love design so I figure it’s about time to start my little fictional band project.
This time I want to do it a bit different and I thought one thing I could do is let my readers in on the fun.
A Little Background
The first thing I figured would be good to do is to document the project from start to finish as it happens, as opposed to putting it up and talking about it after it was done.
Then, last week, while watching all the comments come in about Design Eye For The Usability Guy, I started realizing how helpful that project was to folks and how involved so many people were with the discussion.
This was something new to me. I’ve been talking about design and usability for quite awhile and it’s only recently it seems like these things are becoming a hot topic when talked about together.
I think that is awesome and exactly what I’d hoped to accomplish with this design example project.
So, my brain started going and I thought, “what if I asked my readers to become a bit more involved during the project? What if I helped them shape this project a bit so they could get more out of it?”
Sounded like a good idea to me. So I came up with some ideas that should help y’all get a bit more involved, if you choose, as well as maybe help all of us learn a bit more in the process.
The Deal
As of right now I’ve done nothing but formulate the basic framework of this project. That and of course write up this post to explain it all.
Here is how I think it could work:
- With your help (if you want) we create a back-story for this band. This will give me something to begin with and throw a bit of creative energy into the project. I’ll provide a little bit to get us started, and will take any ideas that come my way to create a scenario.
- Once we’ve “made the band” and created a back-story I’ll kick off the design process, just as I would with a “real” client. Obviously there will be differences, but I’ll try and make it as real as possible. I will explain everything, and note where this might differ from a real project.
- At this point all of you get to play the part of the band, well, in a way. I’ll post once a week, on Thursday, and talk about what I’ve done. You’ll have the opportunity to comment, ask questions, offer feedback or whatever. In this way you’ll help shape the direction of the project, and hopefully, we’ll all learn a lot.
- Once the project is done we’ll do a big post-mortem, talk about the project, the final design and whether or not I met the goals we laid out for this design.
So, there you have it. It might be a wacky idea, but you know, I learn so much from reading about and discussing other people’s projects and processes that I can’t help but think it’ll be very educational. Lot’s of fun too!
Plus I hope to finally show how a cool band site can be usable! I’ve been wanting to do that for awhile. I hope to kick it off with the brainstorming phase next Thursday — so if you want to play, check back then!
What do you think? Am I off my rocker? Any questions? There is still much to be worked out and I’d love to have your input.
Filed under: Design Project
Comments
1. Andrew said:
What an absolutely fantastic idea. Thanks for bringing it up. Don’t know about anyone else, but I have no idea how these client/designer things work (I’m just a codemonk33, me), so it’ll be a great experiment from my perspective.
Tutorials where people go through what they’ve done are ofen very useful, but I get the feeling that being “there” as the process happens will be one of the most beneficial things to hit the scene for a while. Thanks in advance!
Posted on May 27, 2004 11:39 AM | #
2. Daniel Frommelt said:
Sounds like a great project and a different learning tool/process that has not been accessible online before. Count on our support and let us know how we can help.
Posted on May 27, 2004 12:06 PM | #
3. Chris Vincent said:
Sounds like fun to me!
Posted on May 27, 2004 12:09 PM | #
4. Todd said:
Now this is a cool idea. It’s nice to do what you do for a living and have a lot fun while you’re at it.
The back-story aspect is a great imaginative exercise. I have a feeling this is going to be really fun.
Posted on May 27, 2004 12:16 PM | #
5. Jason Santa Maria said:
Feel free to use any of the band names I have been collecting on my site :D
Posted on May 27, 2004 12:23 PM | #
6. Todd said:
And if you do decide to use one of Jason’s names, please make it #77 - Urethra Franklin!
Posted on May 27, 2004 12:38 PM | #
7. Kevin Tamura said:
Count me in. I love seeing how other people work and solve problems.
Posted on May 27, 2004 12:39 PM | #
8. Greg said:
Even better, why don’t you find a site for a band that you like that is NOT up to your “killer” standards. If you are a BIG fan of a band this is a great way to give back to them. Or perhaps you could score some free merchandise in return for the service. Just a suggestion.
Posted on May 27, 2004 12:48 PM | #
9. Aaron Egaas said:
I’ll be following this process wholeheartedly. I’ve been trying to show my employer that CSS based sites can work for Music sits too. Currently they use Flash and “horrible” html code for client sites. http://www.squadstudios.com
Posted on May 27, 2004 12:52 PM | #
10. Keith said:
It’s great to see people don’t think this is a totally stupid idea! ;)
Greg – I thought about that, but I really want to take a project from start to finish. I don’t want to do a redesign. Maybe we can throw that in for one of the coming “Design Eyes”….
Posted on May 27, 2004 01:02 PM | #
11. Tim Uruski said:
Sounds like a great idea! Jason beat me to the punch tho, I was gonna suggest using a name from his list (great feature by the way).
One thing I’m curious about… what sort of band is this going to be? Rock, Punk, Country, Hip Hop? Based on the SOW you seem to have a fairly diverse music taste.
Posted on May 27, 2004 01:25 PM | #
12. Keith said:
Tim – That is where creating a backstory will come in. You all are going to help me with that, although I’ll make the final decision. When I kick it off, I’ll explain more about how it’ll work, but get your brainstorming hat on!
Posted on May 27, 2004 01:56 PM | #
13. Keith said:
Another thing I could use help with is brainstorming a name for the project. I don’t want something corny like “Webbing The Band” or “Pimp My Web site” – just something unique to call this little project.
Maybe I should just wait until we’ve got a name for the band…anyway, if you have any ideas – post them here.
Posted on May 27, 2004 02:05 PM | #
14. Zelnox said:
When do we start?
Posted on May 27, 2004 02:50 PM | #
15. Zelnox said:
A band made up of people voted off American Idol? Hehe (^_^)
Posted on May 27, 2004 02:56 PM | #
16. Lea said:
This sounds fun! :-) When do we get started? Oooh, so many different types of bands to choose from! Any type of band in particular? Rock band? Or… gasp… pop band? Or rap group? Or how about a rock rap pop group? HAHAHA. And Band Names…! This is fun.
And it’d be nice to have little “conflicts” like when the band INSISTS on having EVERYTHING in Flash– how convince them otherwise. They’ll also probably want to have a little e-commerce page to buy t-shirts, stickers, and buttons, too.
Posted on May 27, 2004 03:08 PM | #
17. Joe Clark said:
I tried the same thing when I was researching my book, actually. It fizzled; I hope yours doesn’t.
Posted on May 27, 2004 03:15 PM | #
18. dickwood said:
I do some work for an Artist Development company so
if you are looking for a truly authentic ‘band as a client’ experience, I will be more than willing to assist you. Remember… money up front, they will hate your first, second and third design and they really don’t know what they want so you end up with the first design.
Sounds like a good idea and I look forward to seeing this project in action.
Posted on May 27, 2004 03:20 PM | #
19. Keith said:
We start (most likely) next week.
Lea – let’s not get too out of hand. As much as I’d like to simulate the whole experience, I don’t think that’d be do-able. I’m not going to be building out the whole site – just the basic design and template. No “working” e-commerce at least. But yeah, you guys will help me set up the requirements and goals of the site. And hey, there might be some Flash, you never know.
Joe – I hope it doesn’t fizzle too. No matter what happens I’ll have an example band site at the end of this, regardless of my reader’s input. I’ll carry on no matter what. The plan was to do it on my own originally. No I’m just doing it in public.
dickwood – I’m all for using you guys as a clients as long as it doesn’t get to out of hand. I’m not going to be looking for reader consensus here, just going to let y’all in on the process and allow you to chime in as it goes along. I’ve got to maintain some kind of control or I’ll never get it done.
Maybe I wasn’t too clear: I’m not going to be asking for by-off from the readers or anything like that. I’m just going to let people voice their opinions, ask questions and things like that. Oh and y’all are going to help me set up the back-story and the initial goals – with my help. I mean one of the goals is to show how this kind of site can be usable. If everyone starts saying “we want all Flash” I’m going to veto that of course.
In that way, and in many others, it won’t be like a “real” project. It’s an exercise in usable design and my thinking is to open that process up, not let it get bogged down by “real world” problems.
It’s also just going to be mostly a design / front-end exercise. I’m going to build a page, but not a whole site. I’ve got time, but not that much time.
Just like the producer of a reality TV show – I’m going to take liberties and make decisions to keep it moving. But I’ll be sure and point out where it deviates from reality too much.
I hope everyone is still with me through it all. I want to provide something useful, but not have it “fizzle” as Joe says.
Posted on May 27, 2004 03:35 PM | #
20. Rob Cameron said:
Are you going to set a deadline or is this open-ended? Could it go on for 3 years? :)
Posted on May 27, 2004 04:02 PM | #
21. Keith said:
Rob – good question. It kind of depends, but yeah there will be a loose deadline. I really don’t imagine this taking all that long – like I’ve been saying. It’s not going to be that real. ;) I won’t let scope creep effect it much and at the end of the day I’ll call the shots so…
Posted on May 27, 2004 04:10 PM | #
22. la1itree said:
Love the idea. I was just fumbling my way around a poorly-designed band webpage just yesterday. I’ve also fumbled around trying to MAKE band webpages, and it’s challenging. Can’t wait to see what you come up with.
Here is my first band name idea: The Box Models (I really like this one, I may use it myself).
Posted on May 27, 2004 04:45 PM | #
23. hass said:
Band name suggestion… The Semantics.
Project name suggestion… Codestock (alias, Yasgur’s Farm… ok, that one might be a bit dated).
Posted on May 27, 2004 05:00 PM | #
24. Michael W said:
This is great idea, and I’m looking forward to contributing my opinions.
Perhaps it would be a good idea to pick out a few of the names people have suggested and use them in a poll to find a name for this band?
I’m kind of partial to “The Users”
Posted on May 27, 2004 06:03 PM | #
25. LazyJim said:
Great I’m with you!
As part of the background I’d like to know how you convince the band they don’t want a FLASH monstrosity? Shall we say they are a very understanding group!?
Posted on May 27, 2004 06:09 PM | #
26. DarkBlue said:
I think this is a brilliant idea. It will be extremely interesting to watch the website progress through the stages. It will be fascinating to get to be the client! Best of all, I get to see the professionals at work.
This should be a terrific learning experience for us all. I can’t wait.
Posted on May 27, 2004 08:14 PM | #
27. Tim Hill said:
make a cool record image, I know a tut
goto http://thewebmachine.com/ and click photoshop and then scroll down the left for vinyl records.
can check em out here,
http://thewebmachine.com/photoshop/vinyl/fnished-vinyl.jpg
band name: the conditionals or dr keith’s lonely hearts club band!
punk band punk band!
Posted on May 27, 2004 09:08 PM | #
28. Greg said:
If we’re talking band names… …off the top of my head:
Musical Type?
Pseudo-Class?
The Floats?
White Space?
border-left?
The list could go on indefinitely with allusions to blogging or CSS (I’m sure I could come up with a heap more).
Posted on May 28, 2004 12:27 AM | #
29. Jason Marble said:
There are so many good names. I think a poll will turn a name that at least most of us can agree on.
As far as the flash issue goes, I know most bands love flash and really there’s only few reasons not to. But I think we could pursuade a band into something else with a little creativity. Perhaps a 2 second swap of an image that rolls through 10 frames or so. Add a little music, some attractive rollovers. There’s so much potential. Lets just get creative.
We need a story fo sho :) So many high school and trendy young bands out there. Maybe we could go with a band of older guys. Lead singer sparks a new begining with a bunch of old friends he used to jam with back in the days. They could bust out crazy old school rock in a new school trendy era. They make fun of all the trendy punk bands out there. Kinda like how Blink-182 was making fun of the “Boy Bands”. I think that would be fun for a story. Unique?
I look forward to this project. Thanks Keith. Aprrrrrrreeeeeeecccciiiate it.
Posted on May 28, 2004 01:02 AM | #
30. Keith said:
Before anyone gets too crazy with the Web design related names – I don’t think I want to go that route. To damn corny. I want this to seem at least a little bit realistic.
Oh and there won’t be a poll either, too much trouble. I’ll just have you guys submit and discuss ideas and I’ll choose one.
The name, back-story and all of that is just to get the stage set, I don’t want to be bogged down there and lose sight of what the project is about – showing how a musical artist’s site can be cool and usable and built with Web standards.
As far as Flash goes – We may very well have Flash…I mean there is Flash on this page right? It’s built with Web standards. What we won’t have is some all Flash, mystery meat navigation, long intro crap.
Posted on May 28, 2004 09:39 AM | #
31. Tyim said:
Great Idea! Can’t wait to see how this works out.
How about the band being a Hip-Hop/Bluegrass band? Bio kind of writes itself. My mother played banjo and my father use to kick out rhymes in the park. thats my fifty cents.
Posted on May 28, 2004 10:20 AM | #
32. hass said:
Keith, you can’t get any cornier than the music industry- take the band from “Guns and Roses”, add the lead singer from “Stone Temple Pilots” and call them “Velvet Revolver”? Bleh…
Posted on May 28, 2004 11:07 AM | #
33. Keith said:
hass – Ok that’s true, I guess I don’t want some corny play of CSS or something like that. No “Mountain Top Corners” or “The Farner Image Replacements” or something.
But anyway, we’re not working on the back story until I actually kick this off next week. What I need now is a name for the actual project….
Right now I’ve got “Example Design Project – The Band.”
Not to catchy…
Posted on May 28, 2004 11:24 AM | #
34. Andrei Herasimchuk said:
Welll… in case you’d be open to the idea, there’s a band that I’m very fond of for personal reasons. They are the Del Bombers. Why am I fond of them? The lead singer and songwriter for the group, Steve Grillos, used to work on the QA team for Adobe Illustrator. (Adobe has quite a few musical types in the QA department.) Personally, I think he’s both a great rock singer and song writer, but they have yet to break out.
Now, their sound is very southwestern rock style, so I’m not sure what you think of that Keith. And they are a real band. I know you want to do something “fictional.” But in case you change your mind or are open to using more realistic inspiration for this exercise.
You’d get a chance to create a relevant material in this regard. There’s a backstory that’s quite interesting with them. They have real music that can be used to incorporate into the design. And their albums could open up a way to see how bands should best sell their work on their own web site.
Just a thought.
Posted on May 28, 2004 11:51 AM | #
35. Lea said:
Keith–heh, I didn’t actually mean a real e-commerce site. I thought maybe a page with a form to buy a couple of things to “simulate” a page to buy items would be sufficient. It’s just to make things look more genuine.
Posted on May 28, 2004 12:55 PM | #
36. Keith said:
Andrei – that sounds interesting, however, I really just want to something that is more on an example. Something fun I can get my readers involved with. That way I don’t have to deal with all the real world problems for real.
I don’t think working with real people would be good for something this open, to much could go wrong.
As far as realistic inspiration, I’m enlisting both my brothers to help me keep it as real as possible. They’ve both been in pretty popular bands, my older brother was lead singer for The Fluid, a very popular SupPop band back in the early 90’s.
Maybe down the road this could be something to look into. Maybe a collaboration again, eh? Design Eye For The Southwestern Rock Guys?
Posted on May 28, 2004 01:48 PM | #
37. Jason Marble said:
Keith, do you want the project name to include “Example Design Project” or “Web Design Example” like your previous example project, or is that just for heading purposes?
I thought up of a couple names for the project: “making the band, standards style” or “designing the band”. The first might be a little long, especially if you want to include “Example Design Project” in the heading or something, but I don’t know, you tell me. The second is shorter and could probably stand alone without the example whatever.
Posted on May 28, 2004 02:50 PM | #
38. Allen said:
Using the idea from Jason Marble: “Jazzing up the band, Standards Style”.
Hope you won’t throw away the idea of a jazz band (maybe lounge jazz?). I’d love to see a smooth, mellow design of the 60s.
Posted on May 31, 2004 05:39 PM | #
39. Phil Baines said:
I love the idea, and I will be getting involved as much as I can.
If I manage to get my band back on there feet (www.shmk.co.uk) the site might even be able to benefit from what we learn here.
Posted on June 1, 2004 09:32 AM | #
40. Pat said:
sounds awesome!!
being both a professional musician and a professional web developer let me know if you need any help with anything.. I could even be your “client” if you want to know how a real musician thinks..
can’t wait to follow along regardless.. and nice site by the way.. lots of fun stuff
Posted on June 3, 2004 11:33 AM | #
41. Jordan said:
Im proud of my “horrible” html. Its taken me a while to get my stuff solid enough and figure out all the loop holes in html. flash is much better anyways.. and it uses css now as well.
J
Posted on June 4, 2004 01:34 AM | #
Comments are now closed