Sunday, May 2, 2010

Week 15 – Final Iteration

Well, this is the final blog entry during the development of my portfolio for TWC421. This last week I completed the résumé section of the portfolio. I am generally pleased with how it turned out, both the résumé and the rest of the site.


This coming week, I’ll be putting the final touches on the site. I think I’ll implement Jason’s suggestion of adding the pop-out images. I’ve used a tool called lightbox previously (on the Lannage.com site in fact) that should do perfectly. This portfolio will be a springboard for my future work. It should be easily extensible to add more content and/or pages.


In addition to the portfolio completion, I also need to work on my presentation. I’ve learned some valuable lessons while creating this site. Once I’m done, I’ll post the presentation as well as the link to the complete portfolio. This has been a really enlightening project.

Sunday, April 25, 2010

Week 14 – Integrating Suggestions

I received some great suggestions from my classmates and have begun implementing some of those changes. These include right aligning some of the text as well as getting pop-out images. In regards to content, I was really lacking focus and I think Michael has me back on track and the portfolio will be much more useful for the audience.


These weeks are flying by and I still haven’t got my resume into HTML form. It is down to the wire now, so I’ll have to get it in this week. I will definitely be spending some quality time reviewing it and revising it myself as it wasn’t in during the peer review period.


So, this week, the design is complete and content will be the 100% focus. I’m going to commit to a schedule of getting the resume in HTML by tomorrow (April 26th). That will give me time to smooth out any rough edges on the site and really get it final.

Sunday, April 18, 2010

Week 13 – More Work

Great news: I now have a visually consistent portfolio webpage. It can be found at: http://cypheye.com/twc421 . Be sure to hold shift and hit refresh if you’ve check out the page before to be sure to clear the page cache.


I spent quite a bit of time getting the portfolio to look right between Internet Explorer and Firefox. Even with the trick I posted in a previous post, it still took some time to get it right. Then I had some layering issues… The problem ended up being that I didn’t realize I had layer issues. I had transparent images covering textboxes which made it very “unclear” why you couldn’t select them.


I have my resume complete as well, I just need to get it into an HTML format that looks nice. Also, with the new layout, a little more text with each webpage would be nice so I think I’ll work on that as well. I’ve added the contact page with those textboxes I was mentioning earlier so people can e-mail me without publicly displaying my e-mail address. I’m thinking that may be just an inconvenience for the audience though, and I should just post it and deal with any potential spam.

Sunday, April 4, 2010

Week 11 - Continuing Work

I had mentioned before that the previous screenshot would probably not be the final form, and sure enough, I’ve changed it up a little bit. I wanted to be sure the content really had a form to stay in rather than the title and body backgrounds extending nebulously off to the right. Now there’s a gradient background behind the whole body which is kept at a fixed width. The fixed width really helps the site keep its look and feel no matter which resolution you’re looking at the site.

Based on comments from the review, I’ve removed the “Resume” page and including a small “About me” on the main page. In the screenshot I’ve included, you’ll still see those original links since the picture is actually a Photoshopped image, but those are purely text links and don’t reflect the site in its current state.


I’ve been working on the site locally, so as soon as it’s presentable in its new form, I’ll get it uploaded to http://www.cypheye.com/twc421 (which is where you’ll find the original design, if I haven’t updated it yet).

Sunday, March 28, 2010

Project Report, Week 10 – Editorial Incorporation

This week I came back from Spring break and took a look at my portfolio. Something wasn’t right. It just didn’t have the look I was looking for. I spent a good chunk of time playing with the location of elements and incorporating the suggestions of fellow students.


I finally came to a design that I am mostly satisfied with. I suspect the design may change slightly, especially as I find some nuances of this site in its conversion to HTML/CSS. It will take a little more work to get this into web form as it uses some transparency images that I’ll need to be sure work and line up in all modern browsers.


I’ve begun work splitting up the design and getting the current site modified to accommodate the new skin. This week I will need to focus on getting the HTML in line in IE, FireFox, and Safari. Once that is in line, I can really knock out getting the rest of my content squared away.

Sunday, March 7, 2010

Project Report, Week 8 – Copyright and Fair Use

I’d like to focus my blog this week on the subject that we are discussing in the class boards: Copyright and Fair Use.


The project I am working on is a personal portfolio containing work that I have produced for myself, my personal businesses, and other people/businesses. I will need to be sure that any work I display that was created under commission is authorized to be displayed freely. Even though I may have created the design, I may not be at liberty to re-create that design from its actual owner.


This is a very interesting aspect of copyright law. It is along the same lines as a musical artist not owning the rights to their voice recordings and lyrics since they may have been commissioned and under contract to produce such recordings.


Along with ensuring my work is not blatantly infringing on any copyright issues, I will be continuing to develop and improve the design and content of my portfolio this week.

Sunday, February 28, 2010

Project Report, Week 7 – HTML

Well, I’ve begun getting the site together. You can check out the work at http://www.cypheye.com/twc421. Right now, it works best in IE7+ and I’m working on getting it working right in Firefox.

Unfortunately, IE and Firefox have some subtle differences that present themselves when creating precision HTML/CSS that require goofy hacks to make it work in both. In this case, I’m adding “padding” to the element. This sets the content a certain pixel depth from the edge of that element. IE does this by adding that padded edge to the inside of the element. Firefox expands the element by the pixels defined to create that padding. If you’re familiar with Photoshop, you can think of it like adding a stroke to the element. IE places the stroke on the inside, which Firefox places it on the outside. It is just slightly difficult to make it all behave properly.

The hack you can use is kind of clever. IE has a habit of silently throwing away CSS values it doesn’t recognize. CSS principles stipulate that the last element gets used in a list of two or more keys that are the same. Example:

BODY {
color: #FFF;
color: #000;
}

In IE, the text color will be set to black (#000) even though white (#FFF) was set first, the last one listed takes precedence. But in Firefox, you can add a flag (!important) to the end of an element to ensure it is used no matter when it’s listed:

BODY {
color: #FFF!important;
color: #000;
}

Here, even though black is listed second, the white text color takes precedence (in Firefox only). If you visited a site with this code, in IE, the text would appear black, but in Firefox, it would be white. This works really nicely when I need the width set to one amount in IE and another in Firefox.

This week, I’ll need to nail down all the places this is affected. I’ll also want to take a look at the site in Safari or Google Chrome to make sure it’s working there as well. In addition to getting the site looking right on all reasonable platforms, I need to work on getting some good text into the “software” page.

Sunday, February 21, 2010

Project Report, Week 6 – Prototype

After gathering my work from last week, I needed to come up with a decent way to represent all the work I’ve done. I knew I wanted to highlight my artistic web design skills, but I also didn’t want it to be so “loud” that it detracted from my work. First, I thought I would develop a “business” style site. Unfortunately, to me, “business” style is usually quite bland. It might have a flashy logo, but it’s otherwise set in a simple layout.

Next, I thought I’d take more of a designer approach. I started with a cross-hatched background with a slight gradient. On that, I added my name with some “low” lights as well as the expanded, faded, larger name behind. The organic “pin-striping” was the last touch that added a nice flare to the title.

On my first pass at the body, I had the entire content confined in a box with a large page title at the top and the portfolio entries below. After looking at that for a bit though, I wasn’t quite pleased. I got rid of the bounding box and expanded the title. You don’t see page titles large than the site titles real often and there is probably a good reason for it. However, I made “WEB DESIGN” a little faded to cut back a little on its “grabbyness”. With these changes, the larger page title and the now-free portfolio entries really enhanced the flow of the site.

My next step is to actually turn it into an HTML/CSS website. I expect this to take a few hours and the code/CSS complexity should be minimal. I frequently struggle in getting a really slick looking design, so I like it when that’s nailed down and I can get into the code.

Sunday, February 14, 2010

Project Report, Week 5 – Gathering My Work

This was an interesting week. I got to juggle some school with a business trip. Luckily, there was lots of time to sit around in an airport to get some homework done.

So, for this weeks work, I needed to gather up my work that is worth showing off. Finding websites and art to show off isn’t hard for me. The hard part was that last part from two sentences ago, “worth showing off”. I’ve had years of messing around with websites and playing in Photoshop, but rarely did it result in something worth displaying to a prospective client.

I began by selecting the websites I’m proud to say I designed them. Next, I searched for some school assignments that I really enjoyed, as those are the ones I spent the most time on and can give glowing descriptions of. Finally, I am still searching through Photoshop work. Of which, there are many sites that I thought about making, did make and now they’re no longer hosted, or were just too difficult to create (at my then level of code mastery).

I’m always tinkering around and I also have a few classes that may produce some noteworthy work this semester. This portfolio will need to be an ever changing portal of my work so I can continue to draw in clients. Tastes in websites change and as they do, I’ll need to update, not just the design of the portfolio site, but of the items I display as well.

Sunday, February 7, 2010

Project Report, Week 4

This week I created my portfolio proposal. It contained a lot of information on how I’ll be developing the web page housing the portfolio. One thing it lacked, though, was any hint on how the site might actually be laid out. I figured what the proposal needed to contain was the content that will in the portfolio itself.

Next week, I’ll be focusing my efforts on creating an initial mockup of the website. This will be created in Photoshop and I may even be so bold as to create an initial HTML representation of the site.

I am still a little hazy on how exactly the portfolio will look and what it will display. I have a lot of professional and school work, but not a lot of it is worth displaying. I suppose I will focus on those projects (both educational and profession) that I have really put a lot of time into and have turned out fantastic.

Sunday, January 31, 2010

New Blog

Welcome to my blog site, created for TWC421!