Showing posts with label Web Design. Show all posts
Showing posts with label Web Design. Show all posts

Wednesday, April 15, 2009

Still Pluggin' Away

It's been a bit of a crazy semester.

So I shall attempt to appease you all with this:

A Promotional Site done for my Flash class. Which is a site promoting the webcomic Lackadaisy Cats by Tracy Butler.

Oh, and also a bit of costume work for your entertainment pleasure.

Monday, March 9, 2009

An Update!

An update! Oh my!

Click here to see my first project for my Flash Animation class. It's a web banner ad. Pay no attention to the rest of the site, which is a screenshot. The moving, flashy thing is my ad.

Monday, January 19, 2009

Excuse Me, But Do I Know You?

Well that was a lovely hiatus in which I worked way too much, finished a semester of school (only 3 left!), got engaged (To the wonderful mind and voice behind the Public Servants Quarters ) enjoyed a wonderful Christmas and break from school, worked entirely too much again, and started a new semester of school.

And here I am back again! Though only one image for today, because I think I'd rather have more frequent smaller posts than large posts that only happen once in a blue moon.

This image is from the 3D design class I took last semester, and more specifically from the Soft Sculpture project, which we were to use in a website design.

Sunday, September 21, 2008

With a Flourish, Part 3

See, I said I'd keep going.

This is a continuation of my discussion/explanation of the why and how behind my design at this blog. (Part 2 is here, Part 1 here).

Today's discussion? Vectors.

Most images you see around the internet (if not all) are what's called bitmap images. These images are composed of, essentially, a map of colored dots, or pixels, that all form the image. The way that bitmap images are composed means that when you enlarge them, all you're doing is enlarging the pixels, so the result you get is a blocky, or 'pixelated' image. Vector images are different. Instead of creating a line by putting one pixel after the other, after the other, vector images create a line by using math, an equation, which tells the program that this line should be so wide, should start and stop with this length/proportion and should be this color. Because of this, you can endlessly enlarge vector images because the equation stays the same, you're just proportionally increasing the numbers in the equation. Okay, so thats how I understand it to work, anyway, but I haven't had math in years, so I'm a bit mathematically challenged at this point.

Anyway, the point being that vector images can be much sharper at every size than bitmapped images because it's relying on math instead of a colored sequence of pixels.

Because of this quality, I wanted to create the swooshes and swirls for the background design as vector images, both so I wouldn't have to worry about the rough edges from my pen marks, and I could make sure it was much more even. I wanted my circles to actually be circles, instead of my shaky hand's approximation of circles. It also allowed me to have consistent line widths where I wanted it - and over all, just have much more control over the forms.

Unless people are curious, I won't go into the intricacies of how exactly I created the image via vectors. Lets just say I made use of lots of circles and ovals as guidlines for myself.


The headline was also vectored - but for that, I wanted to incorporate Art Nouveau typography (which was very flowing and hand done. Made to fit the specific area) But I also wanted to tie the background into the header to make them relate to each other - but I didn't want it to just be text stuck inside a border.

I tried several sketches before coming up with one I could work with.


I started off with only partial borders, encorporating the same kind of swooshes and spirals in the background, but they weren't quite working for me. So I tried again.


I found this one to be more in the direction I was looking for, so I decided to run with it. I had to change the dimensions from my sketch in order for it to be the right size for the header, and some other changes and additions were made during the vectoring - but that tends to happen anyway.

Here's the final header:

Monday, August 11, 2008

With a Flourish, Part 2

In my last post I mentioned the work that went into the graphics of my design here, at Laura's blog. I also mentioned that I'd go into a bit more depth about it.

This may become a few part series.


I started out doing a good amount of research, looking at different styles within Art Nouveau. For each one I found that I liked and though might work, I sketched it down in my sketchbook, both to keep it in my mind, and so I've have everything in one place when I needed references. This way, I could also have all the different styles all there to look at so that I could mix and mesh the different things. The sketches with stars and arrows pointing at them are the styles I thought would work best. I wanted something more flowery, flowy, and less geometric.

Once I had these images in my head, I mulled them over, turned them around, mixed and matched them in my mind. And sketched. A lot. On whatever was available when the idea or urge came to mind.

Like my arm, for example.

Soon, though, I was working on finalizing a design I liked. I started here.

I wasn't quite satisfied with this, it seemed a bit too much, too involved. So I tried again.

This one felt much better, the trapped flower worked well, but it didn't quite have the feel I was going for. I thought maybe something between this and the first one.

My third attempt was better, but it just didn't flow nearly as well as the first two.


This was my last try and the final inked design. This is the one I ended up vectorizing. It had some of the more flowery aspects of the first design, while also being a bit more open and simple like the second, but still flowed well, which fixed the problem of the third.

Next up: Vectoring! And possibly the header.

Saturday, August 9, 2008

With a Flourish

I've mentioned it a few times this summer, but in the void of work that was this summer I had a wonderful friend, Laura, who hired me to redesign her blog. As a French major, she writes her blog in French -- anything from translation tips to information about the internship she did in France a couple years ago. Amusingly, this didn't help me much, because I don't know a lick of French, but thankfully she was there to translate for me when I needed it.

The blog started out with just the Blogger Minima Template. Two columns, black and white text, and that's about it. Laura wanted a more open layout, one that didn't squeeze the text of the blog space into a tiny little area like the template had it. She also wasn't big on the one column of text being the only thing that made it to the bottom.

So, my directions were to un-squeeze the text, to make said text seem not so alone on the bottom portion of the page, and, lastly, to give the blog an Art Nouveau feel. Otherwise I had almost complete freedom.

(For those that don't know, Art Nouveau is a style/time period of art and design in the late 19th, early 20th century. It focused on very organic, flowing forms. It was VERY decorative, and quite frankly, it's my favorite period in art. Read a little more about it on wikipedia -- also, if you know who Alphonse Mucha is, he was one of the more famous artists for the style and period.)

This is the finished result.

I started with the layout, and once I got that fixed up I went onto the Art Nouveau portion. I did research, sketches of that research, and sketches of my own for the background image - and then for the Header. The sketches were vectored (A vector image is one that can be resized without losing quality) as a way to give them a clean, crisp look. But the thing I had the most issues with was the transparency/opacity behind the main portion of the blog itself - the coding was a bit difficult to figure out and find.

I'll be posting again soon to show a bit more of the thought and process that went into the design and graphics of the blog.