WEB ART & DESIGN SPRING 2010

Monday, December 14, 2009

Airtight Interactive - Jason Melcher

Earlier in class I mentioned a website that provides a variety of flash-based image galleries. As much fun at is to build them from scratch, it's not very efficient when you have multiple galleries on your website. I've been using Airtight's Simpleviewer and Autoviewer with a certain degree of success over the course of the semester. Once you download the script, you can build the galleries automatically in photoshop and customize as you see fit. They also just released Simpleviewer 2.0 and it looks very clean and professional--best of all, it is free.

http://www.airtightinteractive.com/
http://www.simpleviewer.net/news/?p=66

Upload higher quality video with Youtube alternatives - Ryan Gagnon

Post higher quality video with alternative video uploading websites:

As a film student here at Temple, it is frustrating to use popular websites like Youtube to store video because of the terrible compression rate of the video. If you want your media to look clear and professional on your website, try using alternative sites to upload that video that don't compress so much. Here are two great alternatives with which you can host video. Check out the sample video to see how clear it is.

http://www.blip.tv

http://www.vimeo.com

BIRDY NAM NAM - THE PARACHUTE ENDING from Steve Scott on Vimeo.

Google Reader // RSS - Zander Taketomo

Blogs seem to be getting more and more personal by the day, and it's at the point where the number of them is a bit much to follow. This will mainly benefit gmail users (as they visit google more often,) but really anybody who would like to skip the step of separately visiting each blog, and seeing just updated posts all from one place.

Google Reader tracks updates and puts them all before you in one place.

LINK

Viral Video - Zander Taketomo

I was linked to this video the other day, and realized how well it could have worked for a viral video. The subject matter is extremely interchangeable and definitely has opportunity for expansion.

Looks better in"24p."

Successful 'blogger' blog - Zander Taketomo

I've been visiting this blog for a while just to see clean/casual fashion photography. It's a good example for how professional consistency can look even if one is working from a template. Also, how frequent updates = frequent visitors.

http://thesartorialist.blogspot.com/

Helpful videos - Jeff McReynolds

I know it sounds a little cliche but google/youtube have been once of the most helpful things for this class. One the first day of class I was really worried because it seemed like almost everyone had some experience with the programs we were going to be using and I hadn't even heard of Dreamweaver. Whenever I would run into problems I would type in "how to___(whatever i was looking to do)____in dreamweaver" and almost every time there was something helpful. I'd say the most helpful ones had to deal with shadowbox. (http://www.5min.com/Video/How-to-Use-Shadow-Boxes---Dreamweaver-165849462) This one ended up saving me so much time.

Photoshop tutorials- Jeff McReynolds

http://www.designshard.com/video-tutorials/11-great-photoshop-photo-effects-tutorials/

I "stumbled upon" this right when we started to get into css and I thought it was really cool but I didn't have the time to try and make something like it. It turns out I still don't have the time but it still looks really cool. I can't promise that will be helpful but they seem to go through all of the steps of how to go about taking advantage of photoshop's tools

www.wix.com - Jordan Schindler

wix is a free website host that doesn't run on css, and is far less complicated then using dreamweaver. for those of you who are looking to make a fun website in half the time, wix is definitely a great place. you sign up, and you pretty much get launched into a website editor. the entire website is flash, they allow you to upload things like video, music, and pictures. you can set up buttons to get from page to page, link pages together, give them special behaviors. it comes stocked with a music player gallery and even light box gallery. it is actually a lot of fun, and kind of addictive. check out my work in progress site for rock way.

www.wix.com/jordanross/rock-way

Sunday, December 13, 2009

The Graphic Designer's Guide to Twitter - Jordan Schindler

http://www.examiner.com/x-5730-SF-Graphic-Design-and-Branding-Examiner~y2009m4d6-Graphic-designers-guide-to-Twitter-Hwwow-to-get-Twitter-followers-increase-traffic--get-clients

I found this interview really interesting. It pretty much sits down with a bunch of different graphic designers and they give tips on how to attract more followers to your a social networking site such as Twitter. They give advice in regards to design of your Twitter and what you put up there. Hope you guys found it as interesting as I did.

Lady GaGa hits the viral world - Jordan Schindler


http://www.youtube.com/watch?v=6tZG5j1nGsA

I just thought this was a really hilarious example of remix and mashup, and it is a big viral video
that is floating around the Internet right now, that combines, Lady GaGa's Poker Face, and
different renditions by Cartman from South Park and Christopher Walken. Check it out, it's
pretty funny.

Good Night, Good Luck

My intention for my final post was to provide another "helpful" link which helped me this semester. But in all honesty, I have ran out of such sites, and I'm not going to search frantically for a site that demonstrates the best and easiest way to bring your Flash dreams to life. Instead, I'm going to offer my comforting opinion to my fellow sleep deprived classmates.

When I stumble onto a site that employs flash animation in some way, I tend to back track out of there. When I see motion on a page that I didn't provoke, I don't like it. For one thing, it makes the page a tad more difficult to load, and if you're like me, you have multiple pages open simultaneously, so you don't want one individual site hogging the download.

Second, it reminds me of those annoying advertisements that pop up on other sites. This gripe could just be me, but I want control over what appears on my computer screen.

Finally, it detracts from some welcomed simplicity. Of course you can incorporate some flash as long as your layout calls for it. It's all about balance. If your site is simple to the point that it is bland, try some flash. If you got everything on your site pretty while being fully functional, then you don't need anything "flashy." I don't know. I guess I'm a guy of simple tastes.

I just wanted to put some people's fears to rest. Don't worry, your site looks great.

-- Paul Emmett

Photoshop Tricks

This helpful site provides some valuable tricks when using Photoshop. I came across when figuring out how to slice. The site is built to help web site designers and not the casual Photoshop user who tastefully alters his/her profile photo for Facebook (although it can aid such vain people). It's at least worth checking out. Who knows? you might learn something.

http://www.dobadob.com/design/photoshop-tricks/


-- Paul Emmett

also...before we part ways

It's amazing what people come up with. Someone actually created pillows based on the Dw, Ps logos, etc. 

http://www.mysuitestuff.com/shop.html

They're actually pretty funny. 

-Melissa

Fonts

I didn't think that this post could be useful to someone, but it might be. It is regarding fonts; something we all tend to overlook (Obviously, otherwise I would have posted this much sooner). Fonts are powerful and can speak more to an audience more than the words they compose. For instance, Times New Roman can suggest serious content while Comic Sans can conjure an "easy going" atmosphere. There are millions of fonts out there and they are constantly being made.

We can be among those few who design their own fonts for their own uses; we certainly have the power thanks to Photoshop. But why reinvent the wheel? I rely on this site for downloading fonts and it never let me down. It is, of course, one of hundreds of free font downloading sites, but I recommend this one because of its easily maneuverable layout and decent gallery. I hope it can serve you as well as it has served me.

http://www.fontface.com/main.html


--Paul Emmett

fun post, viral video

http://www.youtube.com/watch?v=xHCu28bfxSI


This is just a fun video that was made as a response to Lady Gaga's 'Pokerface', called 'Netura Face'. Just in case you don't have time to watch- the lyrics are all about type and are hilarious!
(My favorite is 'using adobe's not the same without a Mac'). ---- Melissa

I lay it out like they do in magazines
check out this typeface it’s like smoking nicotine (I love it)
using Adobe’s not the same without a Mac
if it was lead it would be lined up on a track

oh,oh,oh,oh, ohhhh, ohh-oh-e-ohh-oh-oh
I’ll mock it up, show you what I got
oh,oh,oh,oh, ohhhh, ohh-oh-e-ohh-oh-oh
I’ll mock it up, show you what I got

You’ll read my,
You’ll read my,
You can read my Neutra Face
(Even if it’s bold italic)

N-n-n-neutra face, n-n-n-neutra face
nah nah nah nah
N-n-n-neutra face, n-n-n-neutra face
nah nah nah nah

Thought about Futura but the em space was to wide
not even when condensed,believe me i’ve already tried
Gill sans the G is wack when it’s in lowercase
Avante Garde you make me hard but like Helvetica you’ve been played

oh,oh,oh,oh, ohhhh, ohh-oh-e-ohh-oh-oh
I’ll mock it up, show you what I got
oh,oh,oh,oh, ohhhh, ohh-oh-e-ohh-oh-oh
I’ll mock it up, show you what I got

You’ll read my,
You’ll read my,
You can read my Neutra Face
(Even if it’s bold italic) 

N-n-n-neutra face, n-n-n-neutra face
nah nah nah nah
N-n-n-neutra face, n-n-n-neutra face
nah nah nah nah

I won’t tell you that you’re modern
post- or nouveau
cause I’m hype’n with my type’n
I’m not freehandin’, letterpressin’, texting or skywriting
like a finger on a keyboard
break a nail before I cross you
see my references, reference this
check this font cause it’s sans serif


Advertisements with Photoshop

http://pelfusion.com/showcases/42-really-funny-and-creative-print-ads/

Here is a website which compiled several advertisements which exemplify good use of photoshop and graphic design. The images could provide inspiration and/or entertainment.

For Demo Reels

A lot of people in class are making portfolio sites as their finals. As am I, but I'm selling myself as an editor. And film and video editors need demo reels to showcase their work to possible employers. It simply displays the editor's best work and skills in short commercial.

When making my Demo Reel for my portfolio site, I consulted this article by Bill Davis. It lists some very helpful tips when composing a decent demo reel.

http://www.kenstone.net/fcp_homepage/demo_reel.html

-- Paul Emmett

Second Life Article

I've been meaning to post this since we had that presentation of Second Life in class, but my schedule kept me from doing it. Anyway, I came across this article that refers to the game phenomenon in a bigger picture. I realize that there are many theories and philosophical debates that spawn from discussing Second Life. After all, the game allows people to do things that they cannot do in real life.

This article discusses one of the interesting ways in which the Second Life world affects the real world and in a positive way. I found it very thought provoking.

http://www.sciencedaily.com/releases/2008/07/080717210838.htm

- Paul Emmett

Locative Media Site for Philadelphia

http://www.philaplace.org/

This site was just launched last week. It's goal is to unite the Philadelphia experience all on one site. It allows individual users to post their experiences with the city through maps, blogging, images and video. It is especially useful when older Philadelphians reminisce about how their neighborhoods have changed over the years. In a rapidly changing landscape, it is important to document our history. People who actually lived in the neighborhoods can probably give a more accurate account of what the neighborhoods were actually like, especially when it comes to intangible experiences such as mood, smell and pride.

The historic, interactive map is the most impressive feature of this site. Also, I have never seen a more complete library of historic images for Philadelphia. Hopefully this site continues to grow as more Philadelphians donate their stories.

Recycling



I don't know if any of you have seen this video, but it does a great job illustrating how you can recycle your work into an entirely new visual identity. It seems obvious when looking at the video that Disney has in fact recycled their animations. However, when you saw Robin Hood, you probably didn't recognize some of the animation and characters were recycled directly from The Jungle Book. It solid proof that professionals recycle their works, so we shouldn't be afraid to either (images, animations, sounds, code, etc.)


-- Dave D'Alba

Convert to videos to flash without downloading any programs

If you are looking for a quick, easy way to convert your videos without downloading any programs, go to:

http://blip.tv

When you upload your videos to Blip, it will convert your video to flash and will allow you to download it. Because it stores your video files, you can also use the sight as a junk drive, which will allow you to access you files where ever there is an internet connection. This is a real viable option, especially since the sight does not have the time and size restrictions like YouTube.

--Dave D'Alba

JW Media Player Troubleshooting

One thing that I found extremely frustrating with the JW Players is that the video or audio will not play in a browser when selected through Dreamweaver. You have to upload the media to the web and view the site live in order to ensure you media is connecting properly. I believe the media player has to communicate with JW's server in order to play your media files. This is not intuitive since JW gives you the JavaScript and the media player to insert into your site's folder. Hopefully this will save everyone a lot of time and frustration when attempting to get your media working with Dreamweaver.

--Dave D'Alba

background tek I was using through Illustrator

http://vectips.com/tutorials/create-abstract-backgrounds/

Before I lost my site, I was using a few gradient mesh and step blending modes to add some dimension to the backgrounds. I actually had each page with a "room" type of space using basic 3d perspectives and background images.

Here is something similar to the tek I used

http://vectips.com/tutorials/create-abstract-backgrounds/

I wish there were a class on vector imaging.

-Colin Malone

Another Amazing Site

http://melissahie.com/
This is basically everything I wanted to do, before I did it.
Now I don't want to do it anymore, so I am doing something differently.
But I still kind of want to do it...

Click the buttons to watch the scroll.
This is the answer to the question I asked about in class to the guest flash master, all that time ago.
she said she used "mootools" to create it.

-Colin malone

Creative Commons/Public Domain Sites

In addition to Kim's free sound effect websites, I would also like to contribute The Freesound Project (http://www.freesound.org/). You have to join, but it's free. You can also contribute your own personal library of sounds to the site. It's another way to help out your fellow film students. The sound effects would also be applicable to web design (i.e., flash. Also, FreeMediaGuide (http://www.freemediaguide.com/free_public_domain_videos.html) offers a few good sites in which could be useful to spice up your b-roll for a documentary.

--by Dave D'Alba

Kim Burnick- Photoshop Tips

Since I am in two web design classes this semester, I have been using photoshop like crazy. I have had to go through tons of little tutorials online to help me. I also found this cool website that shows little tips to help make life easier in photoshop. It gives a lot of keyboard tricks that are great to know and makes you work faster. Here it is, I hope it helps!

http://desktoppublishing.com/photoshoptips.html

flavors.me

When I talk to my roommates about setting up a website, they actually tell me that it is sort of a thing of the past with blogger and web 2.0 free hosting sites. Then they pointed me to flavors.me, which compiles all your web 2.0 based information onto this single domain.

http://flavors.me/

This raises the most important question for me, in retrospect of this class, "Why custom build a page if there are so many free services now?"

I think the fact that this is what most people do just makes it easier to stand out. All you really need to do is figure out the limitations of all the free stuff and make sure you go beyond it.
What looks like excess now is probably more conducive to holding up in the future, than spendthriftness. That's the way I see it.
Die Facespacetwitube
-Colin Malone

Kim Burnick- Free Sound Effect Websites

Since we are all film majors, I figure we all have had to use sound effects at least once among our many projects. I have a couple favorite free sound effects websites that I always run to when I need them. I have also needed them a lot when working with flash for little transitional sounds. So here are a few good sites:

http://www.grsites.com/sounds/

http://www.acoustica.com/sounds.htm


http://www.pachd.com/sounds.html

Interactive Narrative -Kim Burnick

I thought it would be cool to share with you all the work that has been coming out of the Interactive Narrative class that both Lisa Marie and I took this semester. It was extremely hard, especially if you didn't know anything about flash (which I didn't) but I learned a huge amount. Most of us have uploaded our final projects so you can take a look at them, along with all of the work we have done throughout the semester. Jon Olshefski knows a whole lot about flash so if you are interested you should contact him.

http://www.templefma.org/InteractiveNarrativeF09/

Magazine


N.E.E.T magazine is an online magazine I looked at when designing mine. The page is set up to reflect the idea of it being print- though it's all digital- and it's user friendly and aesthetically pleasing. 
-- by Hannah

statcounter

If you have a website and you want to know whether anyone is actually reading it, it's good to get some sort of statistics on your web views. Statcounter is a good site for this- it's free, you just add a bit of html to your site and it does the rest for you.
-- by Hannah

Flash Link Buttons

In trying to make buttons in flash action script I did a lot of googling for tutorials. Here's one that's simple and to the point if any one is in need of learning some basic flash buttons that act as links: click here.

--By Hannah Schulman

threadless

Since this class as introduced us photoshop I thought I would share with everyone a website where you can submit designs, but they are for tee shirts. I have bought a lot of shirts from this store and think a lot of the designs are clever, so if anyone wants to take a break from designing for the web here is an option to design on clothing.

www.threadless.com

-Shannon Leahy

CSS Reset - Zander Taketomo

From brief discussions with friends of mine, while Dreamweaver is a great program to learn html, it adds a lot of useless extra coding that can be 'messy' to web browsers.

"CSS Reset" apparently helps.

http://developer.yahoo.com/yui/3/cssreset/
50 best css web design resources

http://www.iyiz.com/50-best-css-web-design-resources-for-webmasters/

yekuno
http://speckyboy.com/2009/08/13/30-creative-illustrator-logo-design-tecniques-and-tutorials/

logo design techniques and turtorials

yekuno
http://www.smashingmagazine.com/2008/12/15/10-useful-techniques-to-improve-your-user-interface-designs/

10 ways to improve users interface designs
http://www.smashingmagazine.com/2008/08/11/5-useful-coding-solutions-for-designers-and-developers/

5 useful coding solutions for designers

yekuno
http://www.campaignmonitor.com/designers/?utm_source=smashing&utm_medium=banner&utm_term=&utm_content=0001&utm_campaign=Jul09

email marketing form built for designers give ur clients access and set ur own prices

yekuno

Word press

http://themeforest.net/?utm_source=smashing&utm_medium=banner&utm_campaign=wp

yekuno

create free websites

http://www.wix.com/start/wfree?utm_campaign=smashing&experiment_id=smashflash19

yekuno

alternatives to lightbox

I stumbled upon this website that has a lot of alternatives to lightbox - and many different ways to display an image gallery. I know this is very short notice to change things for the final project but thought that this website could help inthe future.

http://www.smashingmagazine.com/2007/05/18/30-best-solutions-for-image-galleries-slideshows-lightboxes/

-Shannon Leahy

Before we Depart PT 2

I thought this also might be useful for the filmmakers in the class (which may or may not be most of us).
http://www.helium.com/items/1168678-web-design-for-filmmakers

It discusses ways in which you can make your website stand out and advertise your movie better.

- Josh Nase

Before we depart

I thought this might be a useful read as we get ready to leave our class and go out on our own to make websites. It discusses the pros and cons of doing a website on your own or through a professional. Personally I feel like a professional might get the job done better than myself, but they're so damn expensive.

http://articles.webdesigners123.com/design_it_yourself_or_hire_pro.php

-Josh Nase

Top 50 Graphic Design Sites - Jordan Schindler

http://www.davidairey.com/top-50-graphic-design-blogs/

So aside from the graphic design blogs that we looked at in class, I figured that it would be a good idea to have access to some other ones for reference, whether for the final project or for in the future. This blog allows you to find various different blogs, with different interfaces, for your use in various situations. Both Ace Jet 170 and Logo Design Love were both really interesting, and set up in a cool way. Check it out!

Webisodes - Bianca DiMaio

Over the summer I discovered a website called Hulu.com. This site allows you to watch popular shows broadcast on national television, as well as "webisodes". A "webisode" is a series of short shows made for and viewed only over the internet. The idea of web shows is a fairly recent one that has developed over the past decade. One of these web shows that I watched a lot over the summer is called Web Therapy starring Lisa Kudrow. This show is about a therapist who treats people with one minute web therapy sessions via web cam. Basically, it's a web show about the web.

A more recent web show I discovered is The Garfield Show. Garfield is making a comeback as a cartoon and it will soon be on the Cartoon Network as well as the web. I think the internet is a great way to promote new shows that will be on television or Hulu.

Hulu.com is an easy site to navigate, it's free, and it's legal! There are other shows posted including The Tonight Show with Conan and House.

Saturday, December 12, 2009

Remix

Recently I had a discussion with my boss on the concept remixing, or more so how everything is really biting off of something else. The conversation arose when I mentioned that Schooly D (I had just finished filming his show for our website), the old school gangster rapper responsible for the Aqua Teen Hunger Force theme song, had gotten into trouble for using parts of Led Zeppelin's famous song "Kashmir", in which my boss replied that they themselves had ripped it off from somebody else. Also mentioned was the Nirvana biting off of Boston.

Well I just have to say this is the age we live in. Of course this "biting" off of other people has its various levels of severity, but it seems it has become the norm as long as some kind of permission is granted as well as credit is given when its due. Depending on the platform, be it music production, web design, or animation, permission may not be required as long as certain things are considered.

I would say society had just been moving towards this, in that it NEEDS remixes of everything. In a world reaching overpopulation, where you feel more alone standing in a giant crowd rather than in a room by your self; people need familiarity, people need things to connect to. That's why remixing everything has grown to such a standard. If people can connect to a single piece in the production (be itt music, web, tv) they are automatically comforted and more likely to stay tuned as long as this blanket of familiarity resides.

Originals are fantastic, but what really is a true original anymore? Everything samples everything, everything is influenced be everything. Most of us have probably heard that there are only some 7 basic story lines, so how fresh can the new "fresh comedy" really be? Remixes though have the potential to be they're own originals if the design is innovative enough. Just this modular piece from the past serves the purpose of producing this "blanket of familiarity".

I myself actually do not have a criticism for this remix trend. Being a DJ I love all the different remixes that come out in response to the newest "scene" (underground popular) song, and I know my audience loves them even more. Returning to all platforms of potential remix, one can look at it like this: each production has a potential to create a spark, a spark of interest within a mass of people, the remix simply takes that spark further to reach new audiences that may not have been as familiar with the old spark, but then also bring something new to those familiar with the previous spark. This spark grows and grows, crossing different demographics and various audiences, before dying out and being taken apart to be sampled by a very new spark, or to be brought back to life by a fresh new spin on that spark. And so it goes.


-Piotr Bednarczyk

similar cool sites

some cool looking portfolio sites, I'm pretty sure these are all done by the same artist from my last post. Some very super cool looking layouts, but with simplicity still in mind.

http://www.amanitadesign.com/blankasperkova/

http://podvedomim.net/

http://www.amanitadesign.com/perpetuum/


-Piotr Bednarczyk

AMANITA Design

http://www.amanitadesign.com/

This guy's website is awesome. Seems like it was all done in flash. I discovered him when my lady friend was playing his flash game "Samorost 1", where it's like a simple environment puzzle game that requires you to click and activate the appropriate things to move onto the next crazy area. His portfolio site, which is that up there, is supper sleek and cool. A distinct atmosphere is created that matches his style of work. Check it out.


-Piotr Bednarczyk

more on [Adult Swim]

Adult Swim is really at the forefront of innovative thinking, maybe at least interesting thinking. They do a lot of calab work with the lesser knowns of any scene, as well as names we may be familiar with. They are just so different than any other network, with a multitude of 15 minute shows, their [bumps] that go in between advertising to keep you interested even during add space, as well as there coalitions with artists and musicians. Here are some examples; one new thing is even a "build your own DVD", like a mix tape sort of thing, what next I ask...

http://adultswimnewsblog.blogspot.com/
http://www.booooooom.com/2009/02/13/bill-sienkiewicz-for-adult-swim/
http://passionweiss.com/2009/12/08/adult-swim-atl-remix/

and just some words in what it's like interning there

http://blog.buffalostate.edu/tvfilm/bracdj13/archives/2009/06/two_weeks_under_the_belt.php#more

Also just to tie this into Web Design itself a bit more, the [AS] web layout for their TV shows is really neat an fun to look at

http://www.adultswim.com/shows/index.html


-Piotr Bednarczyk

single serving media

Recently I've been calling the type of media I've been interested in producing "single serving media", in that its short, is self contained, and within its short time span, being 5 to 15 minutes, provides a substantial amount of entertainment, more so on the humorous side. So the new wave of internet shows would be considered this, as well as my favorite cable network, Adult Swim, since a lot of their shows are only 15 min.

I strongly believe that our society and culture has lead to the development of humans to have shorter attention spans (my self being a prime example), and that's why there is a growing interest in these shorter packets of entertainment. We've been lead to always expect to be captivated within the first minute or even seconds, otherwise we lose interest immediately; and then we seem to also have been conditioned to lose interest after 15 minutes as well. I've heard the random statistic that the average person's attention span only lasts 15 to 30 min, and I wouldn't doubt it.

I came up with the name (single serving) for this kind of entertainment on my own, but it seems to have already been coined. I found this site by the title "Single Serving Media, Inc.", but unfortunately it's under construction right now. The layout for the one page up right now is still really cool. It's funny cause it uses like a sleek "future of the past" type of look, like sleek 50s stuff. The time left till launch is really neat.
http://singleservingmedia.com/

One of my favorites as well as others I'm sure; and at the forefront of the single serving movement: http://www.adultswim.com/shows/familyguy/index.html
(it may be a 30 min show, but I'll assure you every single joke is definitely self contained and single serving)

-Piotr Bednarczyk

Wednesday, December 9, 2009

Using other platforms with shadowbox

Alright so I wanted to post what Lisa Marie and I found today when trying to embed vimeo player within shadowbox.

I found a helpful tutorial that explains everything you have to do for both shadow box and light box. The directions for vimeo and youtube are towards the bottom.

http://www.barryamundson.com/wp-content/uploads/2009/11/lightbox_walkthrough.txt

Thanks for the help earlier.
Hope this helps others.
-Josh Nase

interesting layout


I found this site, Supermarket Sarah, to have really interesting layout. The way links are set up is pretty interactive.

by Hannah Schulman

One Page Portfolio

Here is another website with some ideas and examples of great websites that work with just one page. There are some great ideas on here that you don't see often, so I thought I would share.

http://designshack.co.uk/articles/inspiration/10-expert-tips-for-designing-a-one-page-portfolio

-Shannon Leahy

Tuesday, December 8, 2009

Web Design Don'ts - Bianca DiMaio

My roommate took Cyberspace and Society last semester and there was a web design portion of the class. She showed me a useful and somewhat humorous link her professor posted to the class's blackboard. This website is all about what not to do when designing a website: www.websitesthatsuck.com One of the links posted on the site is http://www.havenworks.com/. This site is nothing but a HUGE mess. It needs a complete overhaul. There is no organization, it is impossible to navigate, and it is overwhelming to look at. You can check out http://www.websitesthatsuck.com/ to see some other web-disasters...just for kicks.

Some Final Thoughts~Will Rowe

For my last post I just wanted to share a couple of things I learned that are related to good website designed.

•Color-As Shannon said in the post before this, color schemes are key to making a website look right. I purchased a book called Color Index by Jim Krause, which is full of color combinations; it even includes a section specifically for web safe colors. Another way to build good combos is to use Adobe Kuler, which works with all their products, check it out: http://kuler.adobe.com/

•Simpler is better-This has been my motto for a long time, in regards to most everything for design. The cleaner a webpage is, the less clutter, even a lesser amount of colors makes for a good design. Also if something can be accomplished with, Photoshop, HTML, or CSS; this is always better than using JavaScript or Flash. They will run faster, be easier to code, and work almost 100% of the time.

•If all else fails, try Google (or rethink it)-If you can't find the solution to a problem or how to accomplish something with any piece of software, just Google it in a question form. "How do I make tables in Dreamweaver CS3?" Be as specific as possible with the software version etc. Chances are that someone else asked the same question already. Finally, if you can not possibly find the answer on Google, it may not be possible, so rethink what you want to do and try to come up with a simpler (yes I said simpler) way to accomplish it. You will save time and get more done in the end.

Well I can not wait to see everyone's projects and what they've been working on this semester. Its been great Web Art Fall 2009!

Monday, December 7, 2009

color wheel

Sometimes its hard finding colors that work well together so here is a website that gives different options for the amount of colors you want to use and can visually see what the colors look like together.

so if you have a base color picked out and need help deciding on others check out this website.

http://colorschemedesigner.com/

-Shannon Leahy

Sunday, December 6, 2009

10 Movie Promo Sites- Kim Burnick

I was looking up different promotional movie websites to get some different ideas and perspectives for my site. I found a site with 10 recent movies, all with really cool websites. I looked through them and they all have their own unique quality. Some of them even have different websites to describe different aspects of the movie. I especially liked the Superbad website where the intro was the actors talking personally to you. It is interesting to see the different ways that interactivity is used throughout the sites.

Here it is!

-Kim Burnick

Photo Uploading - Bianca DiMaio

My friend informed me about a website that allows you to upload your photos for display online. The only other site I have used for uploading pictures was photobucket, however, I found www.photoshop.com to be much more interactive and interesting to visit. This site seems like a professional way to showcase your photography online. It's interface is similar to iTunes and uses the idea of "cover flow" to view the images. I made an account on the site over the summer upon purchasing a new digital camera.

https://www.photoshop.com/user/biancatake1

Saturday, December 5, 2009

Make Photos Look More Professional - Jordan Schindler

Alright, so for my final project, I had to touch up a lot of photographs we took for promotional reasons to look more like glamorous Hollywood-like photos. Photoshop is an unbelievable resource, and has the ability to allow you to take even the dullest of digital camera photos and make it look like you've been shooting photos professionally all your life. I found this little tutorial extremely helpful, and being able to see a photo in the different stages helped me gage how to do my own work. Hopefully this will help you retouch your own photographs.

Friday, December 4, 2009

Flash Resources~Will Rowe

When I started working with flash I found the ActionScript 3.0 language to be easiest for me to use, as opposed to the graphical interface. I am a Computer Science major and know several different programming languages which ActionScript is very similar to. The great thing about flash is that there are two different ways of getting thing done, the graphical interface for those used to Photoshop, and the coding for people like me who like to control exactly how an application works. The best resource for me learning how to use Flash was Lynda.com. They have training for the graphical interface and the ActionScript language that use videos showing you exactly what to do on screen. I also used the help menu which links to the very extensive Adobe Help, forums, and ActionScript language database. Google is also a good resource, if there was something I wanted to do and could not figure it out, I just searched it and was able to figure it out. Finally, there are several sites that I have included below that have tutorials on how to do cool things with Flash. Enjoy Flash guys, it really is a powerful tool for the web!

Links:

Other Resources
Active Tuts+-Tutorials for making web applications
Chad and Todd-These guys work for Lynda.com and offer more tips and solutions for flash
ActionScript.org-This is THE site for everything ActionScript, definitely a wealth of information

Thursday, December 3, 2009

Create CSS file with Web Slices in Photoshop

For one of my web site assignments i was playing around with the web slices features in photoshop and found that when you create your web slices you can have photoshop make all the slices float in DIV tags insted of putting everything into tables.

To do this create your webslices in photoshop like you normally would but when you go to save for web and devices and you click save in the pop up box where you can name what you want to save your slices as: go to the setting drop down list and choose "Other..." from the choices.

Another dialogue window will pop up called 'Output Settings' will open in here you can change a multiple number of options but since the CSS is what we're concerned with you want to click on the second drop down menu from the top and select 'Slices'. Click the radio button that says 'Generate CSS' and in the 'Referenced' drop down menu choose 'By ID'.

Go head and click OK and name your file (if you already haven't) and click save. This will generate an HTML file and a folder called 'images' where all the slices are saved.

Next you need to open dreamweaver if you don't already have it open, and open up the HTML file that you just created. This is where is gets a little tricky because photoshop combines the CSS with the DIV tags all in the same HTML file. To separate out the CSS to add to a new or existing CSS file you want to open your existing CSS file or go to 'File > New' and in the page type choose CSS.

Now go back to the HTML file you created in Photoshop and click 'Code View' from the display type. In the page code you want to copy everything between the:

brackets, not including the , and paste the code into your CSS file. Then save it in your web site root folder. Now create a new HTML file. Between the '' and the '' brackets insert the code:


If your CSS is in a folder within your root folder your code should look like this:



The '../' denotes your main web root folder, where ever it is located locally. In the body of the new HTML page you just created copy and paste all the DIV tage code from your photoshop HTML file (the code between the and the tags).

Voila! Go back to "Design View" in dreamweaver and refresh your page. Everything should look the way you created it in Photoshop.

Side Note: for good measure you should probably put a container DIV around all your Div slices incase you want to do things like centering your web page within the browser.

Hope this helps!

Class, ID, Tag, Compound? CSS guide!

I was having a lot of trouble trying to figure out the difference between the different types of CSS tags and such when i was in dreamweaver, so after some searching on the web i found this:

http://www.digitalfamily.com/dreamweaver/css-tutorials/css-selectors-cs4.html

Hope this helps if anybody wants to know about the other types of CSS types

Branding vs Art - Zander Taketomo

I found this comment on the weight of branding vs. ones collection of work to be pretty interesting. Its from the opinion of an art buyer (Heather Morton.)

Heather Morton.

Wednesday, December 2, 2009

Use this website to creat a digital magazine layout -Colin Malone

http://issuu.com/
an example can be seen at
www.mcjawn.com

Web sites fit for an iPhone

Alright so I figured this might be useful since web browsing on portable devices is becoming more popular. As we all know our sites have problems as it is fitting on computer screens, I'm sure you can imagine the problems you might run into fitting them onto a tiny little screen like an iPhone. So we need to find a way to easily downsize our websites.

I found this site: http://epiphanet.com/services#iphone which offers servicing to downsize your site and make sure it fits right. However there is a price, and it's probably expensive, so we need to find alternatives.

I'll be honest, I don't know the alternatives, but I'm curious if anyone else does. There's also the possibility this won't be a problem for your site, it may just naturally fit well in a small screen. It's just something to think about though.

- Josh Nase

Tuesday, December 1, 2009

home pages

Here is what I'm basing my professional site on:

http://www.jimcarrey.com

I know that his stuff is a little out there, but it really captures his body of work and his personality, which I think is crucial in a personal homepage. The flash is way too sophisticated for our project, but it definitely provides some good ideas. I also added some other homepages I found on this year's Webby awards.

http://www.conservation.org
http://www.keithtyson.com
http://www.livehopelove.com

The last one is my favorite out of all of them.

-Melissa

Hi-Fructose Magazine

I found this website a couple days ago and it has some incredible imagery. It also has all sorts of different artsy and interesting information. I like the layout and the style that the site is portraying. Check it out!

http://www.hifructose.com/index.php?option=com_content&task=view&id=435&Itemid=56

-Kim Burnick