Think this will keep to the background better, and it looks a little tighter too.
Wednesday, February 22, 2012
bg spasebow!
Refined the ol' ground-backer there, iffn' ye' don't lahk it chye' kn' get out!
Think this will keep to the background better, and it looks a little tighter too.
Think this will keep to the background better, and it looks a little tighter too.
Tuesday, February 21, 2012
Thursday, February 16, 2012
Wireframe, schmireschmame
Sorted out my troubles with wireframe business, took it a little more to heart, and guess what? I looked up : horizontal scrolling websites" in google and got much support! for some reason my brain had not thought to check them out. Well, got some good ideas, both on how to orient a side scroller and how to fit segmented informatino into one page with the help of scrolling boxes and lightbox effects. Presented now is the re-vamped wireframe:
Also, instead of having 3 parts, i've got 4: Main part, bands part, venues part, and News part, which will have an up-to-date twitter scrollbox with bits from the launch staff about who's playing and so on, as well as band's tweets about the conference.
The bands page will have a scrolling box in it as well, with musicians and their info, then when you click on the object that signifies the band, lightbox video opens up and ya get a taste of the tunes, as well as very short band bio and twitter fbook links. I think that's do-able anyway, we'll see.
The venues page will have a 4x4 grid of locations, and when clicked will lightbox into the venue's informatino.
There are alot of boxes in the wireframe, but they denote content, not actual clutter. from examples i've seen, there is actually plenty of room to display your information, and have some fun with your art. At the bottom of the page there will be a little comic about spacement crashing on saturn and playing a show for aliens, for people with a screen big enough to see!
Also, I'm making the bg diagonal, slanting in the direction right, hopefully subconsiously it will help people move about the page. I visited a non-conventional page today that had no nav except through their top left work>posters thing, and i was really frustrated that i had to move that way, there was no interaction navigation on the page itself, and it even looked cool and the work was awesome, the page was well layed out, type was solid, but the navigation ruined it! I hope to avoid that, keep it simple, and useable with some fun in there for kicks.
Also, instead of having 3 parts, i've got 4: Main part, bands part, venues part, and News part, which will have an up-to-date twitter scrollbox with bits from the launch staff about who's playing and so on, as well as band's tweets about the conference.
The bands page will have a scrolling box in it as well, with musicians and their info, then when you click on the object that signifies the band, lightbox video opens up and ya get a taste of the tunes, as well as very short band bio and twitter fbook links. I think that's do-able anyway, we'll see.
The venues page will have a 4x4 grid of locations, and when clicked will lightbox into the venue's informatino.
There are alot of boxes in the wireframe, but they denote content, not actual clutter. from examples i've seen, there is actually plenty of room to display your information, and have some fun with your art. At the bottom of the page there will be a little comic about spacement crashing on saturn and playing a show for aliens, for people with a screen big enough to see!
Also, I'm making the bg diagonal, slanting in the direction right, hopefully subconsiously it will help people move about the page. I visited a non-conventional page today that had no nav except through their top left work>posters thing, and i was really frustrated that i had to move that way, there was no interaction navigation on the page itself, and it even looked cool and the work was awesome, the page was well layed out, type was solid, but the navigation ruined it! I hope to avoid that, keep it simple, and useable with some fun in there for kicks.
Tuesday, February 14, 2012
MBoard
This board is busy and distracts me in the immediacy of it's graphics, but if I blur my eyes I can start to make sense of it.
wireframes, personas, and purpose
I will be re-vamping the LAUNCH website for this project. Given constraints of design and project parameters, I will be focusing on the personas of Babs Bleueribbon and Kevin williams, the college bro and the Hip Housewife, with a link to sign-up page for Ronnie Walker. The website will be sidescrolling, with a floating nave bar that will stay in place while the information changes. Tabs will grow or shrink to show where one is at on the page throughout different navigation designs. It will be broken up into three sections, one with a mission statement of sorts, one with bands and artist bios, and one with participating locations and times.
The original website is a bit garish, with 0,0,256 blue on the page and bad photos. I want Kevin and Babs, when they hit the main part of the webpage, to think of popular-style music, so they will think of their favorite bands a little, and get excited to re-live the nostalgia that brings to heart. I'm thinking Gin Blossoms for Babs, and MGMt and Pearl Jam for Kevin. I'm not going for a 90's style design, but I want there to be a degree of a clean alt-country look melded with the outline-less cartoon monsters of modern indie-pop albums and design. (see: chutes too narrow, carbonmade.com) To have a simple aesthetic while not being childish, like a cleaned up and rocking Dr. Seuss.
Colors will be Blues, Grays, Off-white, touches of orange and red for the Launch logo and buttons to stand out, and dark dark near black for the text.
As far as textures go, the ripped paper look I like but it would be unfitting for this page, so I'm thinking, under the clean shapes and cool colors of the page, underlying textures of old stained wallpaper and ink splashes. Like the cast of a circus gypsy striptease show cleaned up for Sunday Mass. In this way we get a nice, clean professional layout with well-ordered information, with the grease and bloodstains of rock n' roll scrubbed well but not fully cleaned.
Tuesday, February 7, 2012
PERSONAS
Here are three personas who might look at the launch music conference and festival website...
here are some fonts
http://www.google.com/webfonts#ChoosePlace:select/Collection:IM+Fell+DW+Pica+SC|Fredericka+the+Great|Metamorphous|Asul|Sancreek|Inika
notes for the webpage design project for launch:
avoid cliche general lame-o music symbols like guitar necks, we don’t need to show the equivalent of clip art to the personas demographics.
make the page for a range of hearsay informed to those who just spaced on when to sign up or attend. ronnie and pat will be socially aware of these events, having been in or near the scene for years. kevin is a newcomer, and may have just accidentally seen a performance by accident at his fav bar in an accidental way, or picked a mysterious flyer out of his coat from god knows when.
Consider making the page a side-scroller, but it is mostly easier to view a page up/down. There is also the option of an orienteering webpage, that goes left/right and up/down.
Liking the picture change rollover, maybe a band pose then actual mid-rocking.
Keep in mind this is for musicians of many types, not just motorhead rawk black nails mowhawk eargauge, also pretty women singing pretty songs, or happy bands of happiness.
Because of the many types of performers, style must be musical without being overly dark or overly cutesy.
Because of level of performers, style must be refined to a professional, tight look, but not so rigid so as to be boring or predictable, or to lose it’s musical link.
Consider the movement to add musical rhythm to the page bro!
http://www.google.com/webfonts#ChoosePlace:select/Collection:IM+Fell+DW+Pica+SC|Fredericka+the+Great|Metamorphous|Asul|Sancreek|Inika
notes for the webpage design project for launch:
avoid cliche general lame-o music symbols like guitar necks, we don’t need to show the equivalent of clip art to the personas demographics.
make the page for a range of hearsay informed to those who just spaced on when to sign up or attend. ronnie and pat will be socially aware of these events, having been in or near the scene for years. kevin is a newcomer, and may have just accidentally seen a performance by accident at his fav bar in an accidental way, or picked a mysterious flyer out of his coat from god knows when.
Consider making the page a side-scroller, but it is mostly easier to view a page up/down. There is also the option of an orienteering webpage, that goes left/right and up/down.
Liking the picture change rollover, maybe a band pose then actual mid-rocking.
Keep in mind this is for musicians of many types, not just motorhead rawk black nails mowhawk eargauge, also pretty women singing pretty songs, or happy bands of happiness.
Because of the many types of performers, style must be musical without being overly dark or overly cutesy.
Because of level of performers, style must be refined to a professional, tight look, but not so rigid so as to be boring or predictable, or to lose it’s musical link.
Consider the movement to add musical rhythm to the page bro!
Continued for the event
After looking up site after site of music conferences, I noticed a trend: the websites made the conferences look shoddy. Most of them created using a blogger acct like this one, either not designed or clip arted to death. I know it's about the music, but lame website access can really make the event seem like a bunch of garage musicians coming together to drink beers and make tunes, talk about local bars to play at or how it is living in mom's basement. Not that there is anything wrong with that, the raw energy of young garage rockers and thirtysomething 90's alt hits cover players would be fun and interesting, i think. However, this is not the way to depict an event of musical professionals and semi-professionals. 
My brother took a year tour in Australia and NZ last year, and he told me about a music fest called "splendour in the grass", so I decided to look to other countries to find some cool webpages for these events. Splendour's page was cool, with one scrollable page with a map of square photos of the performers and exhibitions and events, like album artists and other such musician paraphernalia: http://splendourinthegrass.com/
http://2011.xy-1.com/
All in all, not finding too many pages with interact-ability, but a few cool designs.
My brother took a year tour in Australia and NZ last year, and he told me about a music fest called "splendour in the grass", so I decided to look to other countries to find some cool webpages for these events. Splendour's page was cool, with one scrollable page with a map of square photos of the performers and exhibitions and events, like album artists and other such musician paraphernalia: http://splendourinthegrass.com/
http://2011.xy-1.com/
All in all, not finding too many pages with interact-ability, but a few cool designs.
Sunday, February 5, 2012
Thursday, February 2, 2012
LAUNCH music conference and festival
For this next project, we are to redesign or make up a conference or event's main webpage, getting most of the needed information onto one webpage. I want to use a bunch of flashy screen movements and interactions and throw the design to the shite-eaters, but poor design and gaudy use of technology are no place for a classroom!
The examples Professor p. gave us in class had to do with beer, and now I am thirsty. I remember reading the blog of a man who ran the SF half marathon with a count of one beer per mile, so I look up his info, but he was just one running drunk, not a whole group or event! So, what else do I do? Besides, school( which I don't want to make a page about) and beer, what else is there?
MUSIC.
Remembering my band's aspirations to have enough material for this year's LAUNCH music conference and festival, I decided to check out their webpage...
HOLY BLUE BATMAN! No amount of round=edged rectangular divs could make that design look cool...maybe. Design aside, look at the douchebag picture they picked to represent the conference! Slimy bald stain'd wannabee taking the crucifix pose for a group of some of the most bored kids I have ever seen! That band must have sucked!
The site is set up in three main groups, info for conference goers, info for bands, and directions and such. Each group has sub-groups with information not even a paragraph long, so I think this will make it a little more simple for me to fit the important information on one page.
Here, I'll do some verbal sketching:
First, I'd like the main meat of the initial viewing of the page to be location, times, and the bare bones info you need to be there if you want to. perhaps have it as a sort of rock poster, where the date is, you click and a full list of dates pop up, or you click the band and a list of each band and their location / time is shown. So, musicians and locations/times sweep in from the sides for a pincer attack. Bringing up the rear would be Donors, holding up the conference with their cash, therefor they will thrust upwards with a page that has their logos, all links to their sites. sofar we have a folding swallow: left wing list of involved bands, right wing list of involved locations, tail list of and links to donors, with the breast being the mission statement of LAUNCH music conference. Should the swallow breathe fire?
The examples Professor p. gave us in class had to do with beer, and now I am thirsty. I remember reading the blog of a man who ran the SF half marathon with a count of one beer per mile, so I look up his info, but he was just one running drunk, not a whole group or event! So, what else do I do? Besides, school( which I don't want to make a page about) and beer, what else is there?
MUSIC.
Remembering my band's aspirations to have enough material for this year's LAUNCH music conference and festival, I decided to check out their webpage...
HOLY BLUE BATMAN! No amount of round=edged rectangular divs could make that design look cool...maybe. Design aside, look at the douchebag picture they picked to represent the conference! Slimy bald stain'd wannabee taking the crucifix pose for a group of some of the most bored kids I have ever seen! That band must have sucked!
The site is set up in three main groups, info for conference goers, info for bands, and directions and such. Each group has sub-groups with information not even a paragraph long, so I think this will make it a little more simple for me to fit the important information on one page.
Here, I'll do some verbal sketching:
First, I'd like the main meat of the initial viewing of the page to be location, times, and the bare bones info you need to be there if you want to. perhaps have it as a sort of rock poster, where the date is, you click and a full list of dates pop up, or you click the band and a list of each band and their location / time is shown. So, musicians and locations/times sweep in from the sides for a pincer attack. Bringing up the rear would be Donors, holding up the conference with their cash, therefor they will thrust upwards with a page that has their logos, all links to their sites. sofar we have a folding swallow: left wing list of involved bands, right wing list of involved locations, tail list of and links to donors, with the breast being the mission statement of LAUNCH music conference. Should the swallow breathe fire?
404
here are some screen grabs of my troubles in html and dreamweaver. i almost consider mark-up as an easier alternative to Dw, but Dw helps by showing the mark-up, so using it will improve both skills hopefully.
boingboing404
Here are a few components of the 404 assignment, a quick sketch with jill on an ibeam with a thermos, and the final form of her sitting. After the conversation in class, I decided to take her off the ibeam and just have her sitting on a bench, enjoying the day. also, I took her jackhammer and placed it next to her as an interactive "home" button.
progress
As a transfer, I needed to brush up on my html / css skills, but AH! a wrench in the gears! A terrible high fever and three days bedrest squelched any chance of working through the rust in my mark-up knowledge and experimenting with dreamweaver! So, nothing for me in the crit, but thanks to the dedicated, skilled, and pretty lab monitors, I am renewed! Their help, combined with my experience with adobe cs products, defeated ignorance and championed a 404 page!
Here are some of the stages in getting divs to work together, instead of warring like petty tribes.
Here are some of the stages in getting divs to work together, instead of warring like petty tribes.
Subscribe to:
Posts (Atom)