emilymancuso.com

For the final project of Web Media II we were to create our own portfolio website. This presented a little bit of a challenge for me. Due to limitations in another class we were not able to put much work into developing our personal brand. So when actually thinking of my site’s design I was a little unsure of what to do. Part of me wanted to make it relaxed and illustrative because those things represent me. However, when I began doing thumbnails I realized that I wasn’t absolutely sure that I wanted to design my site in that way. I wanted to create something that could be easy to design around yet also professional enough to serve its purpose while I contemplate my personal brand. I wanted to keep the design minimalistic so my artwork would make more of an impact. It was my intention that the site’s black and white treatment would make the design and colors of my actual portfolio pieces stand out more.

For the coding it became easier than I had previously anticipated. It is true what they say. Some skills can only be improved on repetition. Doing HTML and CSS coding over the past two projects finally made sense in my brain. Instead of feeling anxiety and worry about how to code the site the coding became easier to me.

I’m pleased with my current portfolio site. It’s simple, direct, and also showcases my work in a professional light. My intention over the summer is to consider more about my brand and then make updates to my site accordingly.  You can view my site at emilymancuso.com.

Package Website

For this project we were to take a package that consisted of six sides and construct a website around it. Using the text on the box we were to arrange a three page website. My package was Great Value’s Honey Nut Spins cereal. For the colors I went with blues and brown and for the fonts I chose Times New Roman and Copperplate. Using Copperplate resulted in learning how to either embed font files or use image replacement. I used @font-face to include Copperplate for those who do not have that font installed on their computer. I also wanted to use rounded corners on my content boxes which proved to be a bit of a challenge for me.
I began to realize how one setting in CSS could effect many different elements on a page. For the nutrition page we had to construct a table to be like the nutrition table found on food items. Using a template offered by Jonathon Cihlar, I added an extra column to accommodate all of my information. The real issue that I had with my package was the Spanish special characters. For every vowel that had an accent mark I had to input special html code. My original design included many rounded corner boxes. However as I began to create the boxes I discovered that it wasn’t as easy as I had expected, in the end I had to change my design a little to something that I could obtain with my current skill-set.

Chris Mills at Pre-Devchatt talk

Last Friday I had the extreme good fotrune to be able to leave work and attend a talk hosted by Chris Mills on the future applications for HTML 5 and CSS3. Apart from his pleasant-sounding accent, Chris was very informative on some new changes that will make designing for the web ALOT easier. Some highlights were the easy coding for video, video captions (that were highlightable and therefore able to be copied!), easy rounded corners, image transitions, etc. The bit that realy interested me was the video captioning. Since I am interested in animation along with design it is one of my nerdy goals to make my own animated series online and have that series be subbed into different languages. Usability and accesibility is on my mind as I think of how I want to go about making my videos. I want people to be able to read them in English and any other language, but also be able to copy text if they so wish.

Another tid-bit that really got me excited was the easy code for rounded corners. For our last Web Media II project I decided that I was going to include rounded corners. In my initial design I went a little over board… and had rounded corners everywhere. Many hours later I was only able to make 2 that actually worked… and I was very frazzled. Rounded corner boxes for a newbie CSS/HTML student is difficult! But not with HTML5/CSS3!! To make rounded corners in the new code it would look something like this

-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;

I haven’t tried it yet, but when Chris showed us how easy it was to make rounded corners I literally thought “Great, I find this out AFTER spending all these hours doing rounded corners the old school way.” I know that the ease of using rounded corners will probably mean that everyone and their mother will be using them and it will become old and stale. Just for right now I appreciate the ease of adding that feature if my design needs it.

Chris Mills was a very informative guy and I really enjoyed going to hear him talk. It feels awesome to know that Chattanooga is making its mark on the web world and getting many web-famous people come visit. Yay for web!!

My simple pleasure.

The one thing I try to do while trying to balance a full time job and school is draw. I’ve always loved to draw since I was little. However I have never really cared for technical drawing. Cartoons have always been a passion of mine.  I try to work on my illustrations when I need a break from my hectic schedule. Sometimes I feel like I’m goofing off by doing it. I apply all this pressure for every minute that I am not working and sleeping should be spent on design and my school work. I always get to the point of burning out each semester and drawing my little characters just makes things seem not as stressful. I have tried to remind myself that I should not risk my mental happiness and even physical well being by being super stressed about work and school. When that starts to happen my designs start to suffer, so I’ve tried to somehow include drawing my characters at least once a week.

As the final semesters of school come up I know it will be harder given the classes are upper division. I wan to include more of my illustrative skills in my designs which means learning more about Photoshop and Illustrator (which I think EVERY school should give some sort of crash course on). However given my limited time schedule all I can expect from myself is to try. So when things get too stressful I’m going to make sure I take a moment to forget my stressful responsibilities and just draw because it makes me happy.

Banner Ads

During my surf through the web for banner ads there was something that stuck in my mind. Lots of web banner ads just … suck. Their main purpose is to get your attention, hold it, and get you to WANT to click on it. 95% of the ones I encountered were poorly designed, had boring copy, etc. I encountered one from Sheraton Hotels that actually looked like some thought was put into its design. The colors are pleasing, the type is spaced and positioned appropriately. Also, right away I was drawn by the curls to the “50% off” in blue. If I needed to book a hotel somewhere this ad would definitely peak my interest.

This other one from ohgoodie.com. The copy and the silhouette of an evil plotting hamster caught my attention immediately. It even got a laugh out of me. So while this one may have a few issues with typography and positioning, the copy and image is what really works. It’s not overly tacky but cute and unexpected.

I choose this other banner at first because it was just so beautiful to look at. The colors were rich and vibrant, but when I got to actually studying the banner it dawned on me that there was text above the word “Midorea.” I really think that that text could be removed from the banner all together, as it lacks legibility in its current state.

Out of the three I selected the Sheraton banner wins as the most successful ad. It is apparent that time and consideration was taken with the type, color, positioning, and copy. It gives the impression of a professional, clean, and trendy hotel just by its use of typography and colors. On the ohgoodie.com banner, I think if the positioning and typography for the copy were revisited then this banner would be even more successful. The last one for Midorea could pull back some of their vibrant colors for the sake of the typography. I feel it would stand out better against the background image of the yellow from the elf/mermaid’s (whatever it is) hair was used on the type.