
INFO:
1021 Mason Ave
Kent, OH 44240
(330) 677-1766
http://www.primalscreen.net(external link)
IMAGE JUMP: PrimalScreen Web Site
I walked into my first day of work wearing khaki shorts and a t-shirt. At that moment, I knew this job was going to be different from any other job I previously had. Primal Screen is a print shop, it mainly prints t-shirts, but also prints other random items. However, I was not there to print, I was there to design their new and improved web site(s).
Before I was actually able to start creating the web site, I had to get a good grasp on how the t-shirt printing process actually works and how the company actually operates. This way, when I sat down to create the web site, it would match the company and everything it does. Those first couple of weeks of designing and creating t-shirt designs was not something I enjoyed. It may seem like an easy process, but to me, it was anything but. When my boss told me to start working on the web site, I was more than willing to stop printing t-shirts and go back to a medium I was more comfortable with.
The old primal screen web site was very basic and definitely outdated. I only remember a Flash piece played when you first visited the site, that is how memorable it was. I was in charge of creating the new site, from the ground up (sketches, design, production). This was the first time I created a site for anyone other than myself...I was up to the task. I was able to implement 3 different technologies into the site. They are explained below.
1. CSS (Cascading
Style Sheets(external link))
This is a technology that is somewhat new and continually grows and improves
upon itself. CSS is the future of web site design, and must be
known to create any functional web site in the world of "Web 2.0" (O'Reilly(external
link) | Wikipedia(external
link)).
The Primal Screen web site was one of the
first web sites in which I
implemented
CSS
across
the
board. I was able to teach myself about div's and span's and a:links, etc.
I have incorporated this knowledge, and much more, into creating this portfolio
site.
During the process, I ran into the typical problems of having to test the site on multiple browsers, (IE, FireFox, Safari, etc), to insure that it would appear exactly the same no matter what browser was being used. It is pretty amazing how one site/CSS Stylesheet can look so different on multiple browsers. As is evidenced by the live site now, I was able to meet the goal of the site looking the same across all browsers.
2. JS (JavaScript(external link))
During one quarter at University
of Cincinnati(external link), I took a C++(external
link) programming
course. From that point on, I realized I was much more of a designer than
a coder. However, when it came to implementing JavaScript on the primal screen
web site, I switched roles for just a moment.
My boss wanted a customer to be able to go to the web site, and calculate the cost of the following:
Individual Shirt Costs
Setup Charges Based on # of Colors
Total Individual T-Shirt Cost - Including Art/Screens
Total Cost of Order
I was put in charge of trying to figure out how to do just that. He asked me how long he believed it would take me to complete, and I looked at him with a blank expression, I honestly had no idea. I answered with a week or two. When it came down to it, it took me approximately 3 days to get the primal screen Online Price Estimator(external link) working, one of my greater accomplishments. I was able to learn a new technology in a short time period and then turn right around and implement it in a real-world solution.
3. Flash (Image Slide-Show)
To give a sense of the atmosphere
of primal screen and the printing process, I decided to implement an image
slide-show on the homepage, using Flash(external link).
One day, I spent the whole day walking around the shop taking pictures of
anything interesting: people, supplies, etc. I put
these photos in such
an order that would demonstrate, to the user, the process of how a t-shirt
is printed.
Instead of embedding approximtely all 40 photos into the Flash file, and making loading times last forever, I learned a simple, yet useful techhnique of simply calling the external images into the Flash movie.This way, load times are bearable and it plays at the speeds I was hoping for. Also, in the future if any images need to be replaced, they can simply overwrite the old file with the new image. Or if any image needs to be added, they can simply add the image to the appropriate folder and add one line of code, instead of having to play around with importing an image into Flash and placing it in the correct place.