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

Monday, November 30, 2009

This is also a really cool site that I found... also with free flash, like Hannah's post. I looked through some of the templates and they're pretty useful for personal portfolios. 

http://www.flashvillage.com/

-Melissa

Saturday, November 21, 2009

portfolio websites

I know a lot of people are doing personal portfolio websites so here is a good site that gives steps to making it perfect.


-Shannon Leahy

Thursday, November 19, 2009

Photo Galleries


When looking for a flash application to display my page like a virtual magaine, I came across a Smashing Magazine article with many different gallery views for photos. Some of them are really neat looking plus they are all free. Check out the article here.

By Hannah Schulman

Tuesday, November 3, 2009

Overheard At Temple - Bianca DiMaio

Last week I stumbled upon a facebook group called "Overheard At Temple". It's a place on facebook where Temple Students can post random, funny quotes heard around campus. When I joined last week there were only around 200 members in the group. Now, there are already over 1,000 members! So, far I think this group along with some the other Temple based facebook groups, has been a good way to unite the Temple community and create more common ground between all of us. As such a diverse campus I thought this was a great and entertaining idea for facebook. It reminds me a lot of Post Secret and fmylife.com. I think the one flaw with this "Overheard At Temple" group is that the posts to the page arn't anonymous. Typically, people don't give names of who the overheard quote came from, but you can see who it is who overheard the quote and posted it. This might leave room for controversy. Either way, this has already become a viral group that has caught onto a significant number of people in a very short amount of time.

Bianca DiMaio

Monday, November 2, 2009

top web design trends- melissa randall post

Hoping to get inspired for our Locomotive Media project, I read this article about some of the most up and coming trends in web design. My favorites were embossing letterpress, PNG transparency, 

I didn't care much for the magazine look, or the look of the introduction blocks. See for yourself and get inspired!

Melissa 


http://www.smashingmagazine.com/2009/01/14/web-design-trends-for-2009/

Tuesday, October 27, 2009

Swine Flu might affect our class!

http://www.reuters.com/article/newsOne/idUSN2620750120091026

An article about how the millions of people staying home because of swine flu might clog web access. Who knows maybe we might not be able to access our class websites!

Seriously though, I find this interesting something as big as the internet could be brought down by the very people who use it.

- Josh Nase

Monday, October 26, 2009

Locative Media~Will Rowe

I found "Views from Above" and "This American Life" audio clip very interesting, as thy would go around documenting the places in which they lived. I started to think about the ways in which people try to capture the world around them; through pictures, home videos, sketches, stories, sounds, souvenirs, etc. Then I thought about the ways that technology can bring all those different artifacts together to create a picture, much like the pumpkin map, of the world. Google has done this in many ways, especially with their Map application, which has user content, pictures, and videos. Giving us a little glimpse of communities and not just a 2-dimensional satellite picture. Seeing what Laura is doing reminded me of all this and what potential it has to bring people together, creating an understanding of different lives all over the planet. Also, while thinking about locative media, I remembered a Vimeo Project that I came across this summer that I wanted to participate in. It is basically creating a map of major world cities through the use of time lapse. If anyone is interested Philadelphia is still open.

Thursday, October 22, 2009

Take180.com - Bianca DiMaio

Two summers ago I responded to an ad on facebook looking for people to test out a new beta-website called Take180.com. At first I was suspicious that it was a scam because it seemed too good to be true that they were willing to pay people for doing such a simple job from home. Since they didn't ask for any personal information I figured that there was nothing to lose.

I responded to the ad and was sent a password to gain access to take180's legit website.

Tak180.com is an interactive website that consists of different challenges for users to participate in. If you win the challenge you get a prize(such as an ipod, laptop, or a trip) and your idea also gets featured in an episode on their web series.

For example, I particpated in a challenge called "Unhelpful Movie Review". For this challenge the users were asked to upload a video of themselves giving an "unhelpful movie review". Here is one of my submissions...

Garfield The Movie from bianca on Take180.com


Not all of the contests required video. Some of them asked for images or even photoshopped photos designed by the users.

Here is a tabloid cover i designed for the "Put the "U" in Magazine" contest. This contest asked for an original magazine cover with crazy headlines that features the user.

Alright! Magazine from bianca on Take180.com


I had a lot of fun working for this site during summer of '08. I also made around $500 for my submissions to the site and getting nominated as a finalist for the tabloid contest.

I think this site is an interesting idea for giving the user the chance to see their work in a real, professional, studio created, webisode. The prizes are definitely a great incentive to gain interest.

So what's the catch right?

I found the biggest catch to be the fact that whatever you submit to Take180.com immediately becomes Take180's property. This means that you are not allowed to upload this video anywhere (like YouTube) EXCEPT for Take180.com. That may not be a problem for someone who is just making goofy videos for fun and not professionally trying to be recognized, but for filmmakers, such as ourselves, this is very limiting. Is it worth selling out for the possibility of winning a laptop? Okay, maybe it is, after all we are struggling artists...

Situationist International's political remixxx

Add Video

The Situationists were known for their radical political stance. Something like anarcho-syndical-communism. They were related to a branch of an art movement called "letterism". They embezzled funds from their college allocated for something like a club pamphlet print or something like that, and instead printed fairly radical communist essay pamphlet dealies. They were reprimanded for this, and suspended until they payed back the funds. They didn't.
What is important to note is that they are probably largest instigating force in the May 68 riots by calling for occupation of the schools, I think Nanterre. The effect rippled all over the world.



OK, so these kids aren't the most coherent thinkers, and are most famous for novelty neologisms. But most thinkers don't affect the physical world. They were great doers. Unfortunately, they've been swept into the academic masturbation circle that is critical theory, and don't often result in any actual practice other than jerk-off paper writing. In short, they were the real shit and since then most political events have been just farts.
-colin

Monday, October 12, 2009

Jeff McReynolds - 10 website tips article

I was bored and stumbleupon got the best of me but I came across a really good article from smashing magazine with a top 10 list in of how to make a website more attractive to get more people on it. I thought it might be worth glancing at since many of use plan on making websites in the future.

10 Useful Usability Findings and Guidlines

http://www.smashingmagazine.com/2009/09/24/10-useful-usability-findings-and-guidelines/

Wednesday, October 7, 2009

Viral Video Response-Will Rowe



This is my viral video response to Hyperactive-Lasse Gjertsen. It is called Hypereactive.

Tuesday, October 6, 2009

Zander Taketomo's "Hyperactive" animation response

Kim Burnick- Viral Video Response

Here is my response to Hyperactive - Lasse Gjertsen. It was way harder than I thought!

Wednesday, September 30, 2009

Monday, September 28, 2009

Colin Malone-viral vid



I enjoyed this one a few years ago. It's simple and I actually feel suspense from trying to anticipate the rhythm. Plus his face is funny.

Jason Melcher - Viral Video Selection

Ryan Gagnon - viral video post

VIDEO OF USE OF ACOUSTIC WEAPONRY AT THE G20 PROTESTS

Although this viral video certainly isn't funny, its neat to consider how rapidly the G20 protests spread across the internet last week. This video was posted 3 days ago and already has over 270,000 views.

Melissa Randall Viral Video



Kid makes a music video actually sends it to Ad Agencies, hoping to find a job...FAIL. Below is a link for all of the negative feedback he got from possible employers.

http://www.mediabistro.com/agencyspy/online/someone_please_just_shoot_the_adkids_125109.asp

Sunday, September 27, 2009

Piotr Bednarczyk's Viral Video

http://www.youtube.com/watch?v=6_YlkEUOonI&feature=PlayList&p=1F2822353282D306&playnext=1&playnext_from=PL&index=3

Power Thirst - Zander Taketomo

This video has floating around on the web for a while, and has been recreated in more extreme/offensive, and more comedic ways. It could be fun to work with as anyone can insert their own meaning while re-creating.

Jordan Schindler's Viral Video



by now, everyone has heard about kanye west calling out taylor swift at the video music awards. and yeah, it was a real awful thing to do. but this video remix to obama's healthcare speech, i think is hilarious. i wouldn't want kanye interrupt me when it was important.

Jeff McReynolds - viral video

http://www.youtube.com/watch?v=Pyp34v6Lmcc&feature=channel_page

Dave D'Alba - Viral Video



This is an example of a more recent Viral Video. It was posted earlier this month and is approaching 300,000 views. It's only about 4 minutes long since it repeats halfway through.

Kim Burnick- viral video




Not sure if this is considered a viral video, but I think it would be cool to make videos like this one to get some sort of message across, whether it be the same subject or a different one. He made this for the internet and it won an emmy.

I also really like this one, from the same artist.

Josh Nase - Viral Video

Alright I changed my video to "Next Friday" done by the "Driving on Salvia" guy.

Shannon Leahy - Ninja Cat

Jason Sheck - Viral Video

The video that i chose is Zombie Kid. This video came out on youtube a few years ago and became very popular. There are many different renditions that people have posted on youtube replying to this video.

Will Rowe-Viral Video

I remembered this video from a couple years back, in fact it was originally posted to Google Video and made it to #1; all before Youtube had been launched in early 2005. I have always been interested in videos that redo older things like Super Mario Brothers in a different way. This concept has been emulated and applied in various ways since.


Hannah Schulman- Keyboard Cat


this has inspired many responses, where they use clips of movies or tv followed by keyboard cat playing them off
more responses at playhimoffkeyboardcat

Bianca DiMaio - Viral Video

This video has been around for a while. I thought this would be a good idea to make a video response to because there are many different takes you can have on it. This is "The Evolution of Dance" http://www.youtube.com/watch?v=dMH0bHeiRNg I think it would be cool to make our own "Evolution of...." videos.

Tuesday, September 22, 2009

Viral Videos

Source for Viral Videos
Webby Nominees since 1997.
Viral videos are listed towards the bottom.

Sunday, September 6, 2009

Rhythm

During the first lecture when we got to the section labeled "Rhythm," I was captivated by the image of multiple rows of cars. I kept wondering what was so captivating about this image and other images like it that I found. The rhythm found within these images is visually stimulating and very pleasing to the eye, but why? In the slide with the cars it says that, "Balance and rhythm work together to create designs that are vital, achieving both stability and surprise." So maybe the stability is the key, but I needed more explanation so I searched the
internet. Webdesignfromscratch.com has an article about the concept of rhythm from a web organization standpoint. They explain that “once you’ve decoded even one or two examples [of headline styles], your brain creates a rule or pattern on the fly you then use that rule to recognize and interpret subsequent example of the header.” Our brains like patterns that repeat because they allow it to easily decipher the meaning of images and information, making it pleasant to look at.
~Will Rowe

http://www.webdesignfromscratch.com/web-design/rhythm-and-repetition.php


Industrial Repitition ~mkrigsman









Oh to be different ~macca















slea repitition ~Melody

Tuesday, September 1, 2009

Wikimedia Commons

http://commons.wikimedia.org/wiki/Main_Page

This is another good source for creative commons lincensed images.

Sunday, August 30, 2009

Welcome to Web Art and Design/Multimedia Production

This blog will be used to respond to class readings and generate further discussion on topics covered in class. We will also post links to resources such as technical tools, theoretical topics and examples of inspirational web art and design.

Please check back on this blog regularly for new content!