 |
Send This Project |
 |
Leave a Comment |
 |
Appreciate It! |
 |
Share This |
Slacker.com
Statistics
Created: 12/12/08
Last Edited: 12/12/08
Views: 60
Appreciations: 1
Comments: 0
Project Info
Owners
Credits
Pete Petras, David Parise
Tags
From: Jason Loftis's Portfolio
Role: Visual Designer
Employer: Slacker.com
Employer: Slacker.com
Slacker.com is an internet radio company in San Diego, California. I took a visual design position with Slacker in May 2008. Despite achieving great success with the company as a designer, I was let go in December 2008 as part of a company-wide lay off that included several people. I thoroughly enjoyed my time at Slacker and learned a great deal from my fellow designers, David Parise and Pete Petras.
During my time with Slacker, I primarily focused on web design. It is difficult to exclusively showcase my work when displaying screen captures from the website because every project involved multiple designers, marketing specialists, usability testing, and the coding work of several developers. But if you browse the Slacker website, you will come across my work in bits and pieces throughout.
Under the direction of the Art Director and Vice President of Design, I took the design lead on the follwoing projects:
1) Slacker's new online store that launched in September 2008.
2) The new top navigation bar that launched in September 2008.
3) The online portion of the "out of the box experience" for our Slacker G2 Personal Radio Player.
4) The online process for redeeming our gift cards.
5) The online user registration process for those accessing Slacker through a Sony Bravia television equipped with the Internet Video Link.
6) The "Where to Buy" page outlining three options for purchasing the Slacker G2.
7) The sidebanner content on our homepage used to promote our products, services, and promotions.
8) The radio station artwork for our seasonal stations during Halloween and the Winter Holidays.
9) I worked on several projects before I left the company that are not yet implemented, and I cannot include them in my portfolio at this time.
My involvement with these projects primarily involved laying out comps in Photoshop. Sometimes, I created original vector images in Illustrator. Most of the time, I was provided digital assets like a 3D rendering of our G2 Personal Radio Player, and I manipulated the image for use in the store or in a sidebanner ad. Due to the fast pace of our work, there were times when I used a piece of stock art as a foundation and worked with it in Photoshop to make it suit our purposes. This was often the case with sidebanner ad material and radio station artwork. Therefore, my job was not just about manufacturing original art but also about creating functional and attractive user interfaces whether that involved ecommerce, a registration process, a set-up flow for a consumer electronics device, or an effective adverisement. In addition, I proved to be a valuable team member because I know CSS, XHTML, and PHP. That knowledge allowed me to serve as a liason between design and development, ensuring that comps were efficiently and properly executed by our coders.
During my time with Slacker, I primarily focused on web design. It is difficult to exclusively showcase my work when displaying screen captures from the website because every project involved multiple designers, marketing specialists, usability testing, and the coding work of several developers. But if you browse the Slacker website, you will come across my work in bits and pieces throughout.
Under the direction of the Art Director and Vice President of Design, I took the design lead on the follwoing projects:
1) Slacker's new online store that launched in September 2008.
2) The new top navigation bar that launched in September 2008.
3) The online portion of the "out of the box experience" for our Slacker G2 Personal Radio Player.
4) The online process for redeeming our gift cards.
5) The online user registration process for those accessing Slacker through a Sony Bravia television equipped with the Internet Video Link.
6) The "Where to Buy" page outlining three options for purchasing the Slacker G2.
7) The sidebanner content on our homepage used to promote our products, services, and promotions.
8) The radio station artwork for our seasonal stations during Halloween and the Winter Holidays.
9) I worked on several projects before I left the company that are not yet implemented, and I cannot include them in my portfolio at this time.
My involvement with these projects primarily involved laying out comps in Photoshop. Sometimes, I created original vector images in Illustrator. Most of the time, I was provided digital assets like a 3D rendering of our G2 Personal Radio Player, and I manipulated the image for use in the store or in a sidebanner ad. Due to the fast pace of our work, there were times when I used a piece of stock art as a foundation and worked with it in Photoshop to make it suit our purposes. This was often the case with sidebanner ad material and radio station artwork. Therefore, my job was not just about manufacturing original art but also about creating functional and attractive user interfaces whether that involved ecommerce, a registration process, a set-up flow for a consumer electronics device, or an effective adverisement. In addition, I proved to be a valuable team member because I know CSS, XHTML, and PHP. That knowledge allowed me to serve as a liason between design and development, ensuring that comps were efficiently and properly executed by our coders.
The Landing Page for the Slacker.com online store.
The Portable Radio section of the Slacker.com online store.
The Premium Radio section of the Slacker.com online store.
An example of a lightbox opened on the Portable Radio page in the Slacker.com online store.
An example of a lightbox opened in the merchandise section of the Slacker.com online store. Note the product tiles for the items already added to the persistent shopping cart.
I included this screenshot as an example of the sidebanner content I designed. The constant challenge was designing sidebanner images that blended in with the gradient background behind the web player. This particular sidebanner is part of a series that appeared when users are logged in as "premium" subscribers.
The screenshot above includes another example of a Premium Radio sidebanner. The "Holiday Hits" station image is an example of radio station artwork. The screenshot above shows it in context, and the image below is a larger version.
This was a case where I took a vector image of a snow globe acquired from istockphoto.com and worked in the Slacker "S" Note logo and our name on the nameplate along with a subtle musical note pattern in the background. The key here was developing a worthy concept and then finding an efficient way to create the asset. Sometimes a combination of stock art and Photoshop skill are the best approach in a commercial design setting.
There are more Holiday Station Images below. They all include a combination of stock art and my own illustrations blended together in Photoshop. All of the concepts are my own.
This was a case where I took a vector image of a snow globe acquired from istockphoto.com and worked in the Slacker "S" Note logo and our name on the nameplate along with a subtle musical note pattern in the background. The key here was developing a worthy concept and then finding an efficient way to create the asset. Sometimes a combination of stock art and Photoshop skill are the best approach in a commercial design setting.
There are more Holiday Station Images below. They all include a combination of stock art and my own illustrations blended together in Photoshop. All of the concepts are my own.
The screenshot above is the Slacker.com "Where to Buy" page. It offers the consumer three options for purchasing the Slacker G2 Personal Radio Player. The sidebanner is an example of a series of advertisements I designed to promote the Slacker G2 and introduce new users to the Slacker service.
The above screenshot is one of the pages in the "Out of the Box Experience" that guides a person through the steps necessary to register and set-up his/her Slacker G2 Personal Radio Player.
The above screenshot is the first page in the gift card redemption process on Slacker.com
|
Send This Project |
|
Appreciate It! |
Other Projects From
Comments