tag:blogger.com,1999:blog-11301171035472576682024-03-13T02:56:46.549-07:00Lunacium BlogA digital catch basin for my demented and occasionally dangerous design thoughts, links, and most importantly projects.Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.comBlogger40125tag:blogger.com,1999:blog-1130117103547257668.post-43603888920863183502013-11-04T15:16:00.003-08:002013-11-04T15:16:45.820-08:00Adventures in Responsive Design - with a minor in bootstrapTwitter's bootstrap launch quite awhile back until a couple months back I hadn't had a need for it so I never bothered with it. My current position as a graphic designer/web designer at Handstands in Sandy Utah, manufactures of Refresh Your Car, Driven by Refresh, and Bahama & Co. automotive air fresheners, I was tasked with redesigning all four of our websites. The task was to bring them from their current 1999 design wrapped around 2002 code and build something great; simple right?!<div>
<br /></div>
<div>
In my last job I had worked with a team of developers, my job being Senior U/I designer. One of the developers kept pushing for responsive technology to be used and was a fan of Twitter's Bootstrap, ultimate he lost to decision makers that had no business making the decision and it was built around something else. However his enthusiasm stuck with me and so I proposed Bootstrap for my redesign. </div>
<div>
<br /></div>
<div>
The sites are only hours now away from launch, ahead of the company going to the AAPEX tradeshow in Las Vegas for the 2013 show. As the deadline approach and the sites are now in the hands of other employees for some quality checking, I thought I would take a minute and post a short note. </div>
<div>
<br /></div>
<div>
The verdict on Bootstrap: its a win! As a designer who codes and not a coder who designs, I would give Bootstrap a resounding thumbs up for being designer friendly. Obviously you need to be able to code a basic site from the ground up rather than drag and drop your elements like some services out there allow for. But having the media queries built in, all the classes for the different sizes all defined, a detailed outline of how stuff stacks and flows, really went a long way to going from dipping your toe in the pond to just saying 'screw it!' and plunging into the water head first. As I moved through the sites I became more comfortable and found new and better ways to implement the classes, which leads me to the only real problem I faced.</div>
<div>
<br /></div>
<div>
The only issue I had was that by the time I had completed the first two of the four sites using Bootstrap V2, V3 had been released which while similar, had changed up several things. The largest thing I had to incorporate into my design and thinking was the 'mobile first' aspect. With this way of thinking your site is actually built for col_xs first rather than for desktop viewing and then is essentially scaled up rather than down. More clearly stated, the 'xs' state of the site is the base size. I won't lie and say I built my sites in the best possible way and took full advantage of this 'mobile first' approach but I did learn a lot over the last two sites that I can use in the future. (Just as a side note, no I probably won't go back and convert the first to sites to V3, just cuz I don't get paid enough for that!)</div>
<div>
<br /></div>
<div>
I took this opportunity to also try some new design paths and explored some avenues in the same township as Microsoft's Metro design aesthetic. I love Metro and how well it works so this was great opportunity try my hand at it as well.</div>
<div>
<br /></div>
<div>
If you are interested you can view the sites I've built around Bootstrap at the following url's starting on November 5th, 2013.</div>
<div>
<br /></div>
<div style="text-align: center;">
Handstands Corporate Site: <a href="http://www.handstands.com/">http://www.handstands.com</a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
Refresh Your Car: <a href="http://www.refreshyourcar.com/">http://www.refreshyourcar.com</a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
Driven by Refresh: <a href="http://drivenbyrefresh.com/">http://drivenbyrefresh.com</a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
Bahama & Co.: <a href="http://bahama-co.com/">http://bahama-co.com</a></div>
<div>
<br /></div>
<div>
-Zombie Jake</div>
<div>
<br /></div>
<div>
Here are three screen captures as the main site, Refresh Your Car, responds to browser window size. <i><span style="font-size: xx-small;">(using version 2 of Bootstrap)</span></i></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgOu7roLcr4lTEkqh6vnWSpiQnOOeVhIOeXr0g6l1_f918u24fq46InEAXsRroLsrQzQgnN8UtkuvGnVZ_LLVDdI57_bZJT8nh0IEfPxYabTrPgZVg_P8TDPz4C6WXIxt1iyxqG5UFZE0/s1600/refresh_full.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="160" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgOu7roLcr4lTEkqh6vnWSpiQnOOeVhIOeXr0g6l1_f918u24fq46InEAXsRroLsrQzQgnN8UtkuvGnVZ_LLVDdI57_bZJT8nh0IEfPxYabTrPgZVg_P8TDPz4C6WXIxt1iyxqG5UFZE0/s320/refresh_full.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Full Screen View</td></tr>
</tbody></table>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEMedhRxtiMpm_cfDXORzSM_467CcpcUIoRP2MnFmsw90eU5zKWhHT9Cdr84b64xaSCNuCgVzsGFjZOScfX-Uijg55eSZ3Vtq4tha8JzRrEg8Mrdkaki0_gLi-2nB473mtQvJLmIsQcPg/s1600/refresh_medium.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEMedhRxtiMpm_cfDXORzSM_467CcpcUIoRP2MnFmsw90eU5zKWhHT9Cdr84b64xaSCNuCgVzsGFjZOScfX-Uijg55eSZ3Vtq4tha8JzRrEg8Mrdkaki0_gLi-2nB473mtQvJLmIsQcPg/s320/refresh_medium.png" width="297" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Medium Screen View</td></tr>
</tbody></table>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnwaCVz_mcN8d3uVFYWY6-y6tgP08FIyCLBhWOR4LF6sqOUfoooFq_fjIg2H3cK36SGFj4YA9NWSdFte-Hv0D4y14FeIVq1qi7PCU6JAN0sK_A7q_2a9yqMmf6-yMvWzkzfTofPDKJ77I/s1600/refresh_small.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnwaCVz_mcN8d3uVFYWY6-y6tgP08FIyCLBhWOR4LF6sqOUfoooFq_fjIg2H3cK36SGFj4YA9NWSdFte-Hv0D4y14FeIVq1qi7PCU6JAN0sK_A7q_2a9yqMmf6-yMvWzkzfTofPDKJ77I/s320/refresh_small.png" width="184" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Small Screen View</td></tr>
</tbody></table>
<div>
<br /></div>
<div>
<br /></div>
Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-61552801912942273742012-12-14T16:11:00.002-08:002012-12-14T16:11:19.966-08:00Terribly sad day. Tears as all of those little ones leave this world.Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-39428949604775554922012-10-29T14:12:00.000-07:002012-10-29T14:15:06.305-07:00Two Big Updates<h2>
<span style="font-family: inherit;">Update 1 - </span></h2>
<span style="font-family: inherit;"><br /></span>
<span style="font-family: inherit;">Working with my close friend DJ Osborne of BlackLabel Development, who I did the branding for, we are nearly completion of a huge iOS app, retina iPad specially, for Miller Motorsports Park in Tooele, Ut. The app will debut tomorrow, 10/30/12, in Las Vegas, Nevada at the 2012 SEMA event. The 2012 SEMA event, <a href="http://www.semashow.com/" target="_blank">SEMA Show Website</a>, is described as: </span><br />
<span style="font-family: inherit; font-size: x-small;"><i><br /></i><i style="background-color: black;"> "<span style="line-height: 18px;">The SEMA Show is the premier automotive specialty products trade event in the world. It draws the industry’s brightest minds and hottest products to one place, the Las Vegas Convention Center. In addition, the SEMA Show provides attendees with educational seminars, product demonstrations, special events, networking opportunities and more."</span></i></span><br />
<span style="font-family: inherit; font-size: x-small;"><i><span style="background-color: white; line-height: 18px;"><br /></span></i></span>
<span style="font-family: inherit;"><span style="line-height: 18px;">With last year's event drawing more than 60,000 domestic and international buyers the opportunity is one I took very seriously and work feverishly to complete on time but with close attention to detail.</span></span><br />
<span style="font-family: inherit;"><span style="line-height: 18px;"><br /></span></span>
<span style="font-family: inherit;"><span style="line-height: 18px;"><br /></span></span>
<span style="line-height: 18px;">Here is a sample of the the default screen, seen after the app loads on your device:</span><br />
<span style="font-family: inherit;"><span style="line-height: 18px;"><br /></span></span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqWjqChMsR0lBb1ajdQnMuZFwks53051OL9jkpKxlLMK-m9g5ee-xxWtNiikebOxaIRs6udQfnZMm0CI9ZP6nle_5A_RCuB64pUpwXI2Z4B6inwsEox_JIYxoXyr0b-b-Bx1Kc_cR3UyY/s1600/homePage.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="color: black;"><img border="0" height="248" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqWjqChMsR0lBb1ajdQnMuZFwks53051OL9jkpKxlLMK-m9g5ee-xxWtNiikebOxaIRs6udQfnZMm0CI9ZP6nle_5A_RCuB64pUpwXI2Z4B6inwsEox_JIYxoXyr0b-b-Bx1Kc_cR3UyY/s320/homePage.jpg" width="320" /></span></a></div>
<br />
A subpage for the tracks unique Boss Mustang program the Boss Track Attack for Boss 302 Owners.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOAPJ9EjMh6u4pS7_twWzzoi9lHRfDUyPBd_zAexHIGUTI1CgFbQf7t6XTLSy_1HESuQGpGbhB709ji5vZtgZpJxga-NDmOaQVsVbxoAd0Wf_d3ZVqv82KGSxm0Mi9AhniUiCMHZeAs1Y/s1600/BTA_landing.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="color: black;"><img border="0" height="248" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOAPJ9EjMh6u4pS7_twWzzoi9lHRfDUyPBd_zAexHIGUTI1CgFbQf7t6XTLSy_1HESuQGpGbhB709ji5vZtgZpJxga-NDmOaQVsVbxoAd0Wf_d3ZVqv82KGSxm0Mi9AhniUiCMHZeAs1Y/s320/BTA_landing.jpg" width="320" /></span></a></div>
<br />
An additional subage for Miller's Raptor SVT Assault, a one of a kind program in a 900+ acre off road racing park.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglF0_H_0lrInW4M_qjDj6SgelZ7UCqUIru8FIA0Ut82b7Irk843ol0y4UdHG4eWF04xfacBXdEEk04ZEv9rUdvHue-ihsLLQjc11BbFcnTHD6nqv0K8yHPzVkGDr-593RJmERhBL21ZKY/s1600/raptor_landing.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="color: black;"><img border="0" height="248" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglF0_H_0lrInW4M_qjDj6SgelZ7UCqUIru8FIA0Ut82b7Irk843ol0y4UdHG4eWF04xfacBXdEEk04ZEv9rUdvHue-ihsLLQjc11BbFcnTHD6nqv0K8yHPzVkGDr-593RJmERhBL21ZKY/s320/raptor_landing.jpg" width="320" /></span></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<span style="font-family: inherit;"><span style="line-height: 18px;">The app represents an entirely new look for Miller Motorsports Park as they diverge into a more professional look representative of their rankings among the world's premier motorsports facilities.</span></span><br />
<span style="font-family: inherit;"><span style="line-height: 18px;"><br /></span></span>
<span style="font-family: inherit;"><span style="line-height: 18px;"><br /></span></span>
<span style="font-family: inherit;"><span style="line-height: 18px;">The app was developed under the Black Label Development banner, <a href="http://blacklabeldev.com/" target="_blank">http://blacklabeldev.com/</a> or <a href="http://www.facebook.com/BlackLableDev" target="_blank">http://www.facebook.com/BlackLableDev</a>.</span></span><br />
<span style="font-family: inherit;"><span style="line-height: 18px;"><br /></span></span>
<span style="font-family: inherit;"><span style="line-height: 18px;"><br /></span></span>
<br />
<h2>
<span style="font-family: inherit;"><span style="line-height: 18px;">Update #2 - </span></span></h2>
<span style="font-family: inherit;"><span style="line-height: 18px;"><br /></span></span>
<span style="font-family: inherit;"><span style="line-height: 18px;">LunaciumSpeed.com has been up and running for a few months now with growing </span></span><span style="line-height: 18px;">success. In the short time I have moved production from Printfection to Spreadshirt and have already been able to cut prices to a more reasonable price for tshirts. Lunacium Speed is represented on <a href="http://www.facebook.com/Lunaciumspeed" target="_blank">facebook</a> as well as twitter at #lunacium and of course the retail <a href="http://www.lunaciumspeed.com/" target="_blank">site</a>.</span><br />
<span style="line-height: 18px;"><br /></span>
<span style="line-height: 18px;">Additionally Lunacium Speed is the premier sponsor of the number #52 car, twitter #52OsborneRacing, run by <a href="http://www.osbornemotorsports.com/2012/" target="_blank">Osborne Motorsports</a>.</span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://sphotos-f.ak.fbcdn.net/hphotos-ak-ash4/218904_176254849178191_1374097384_o.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="color: black;"><img border="0" height="240" src="http://sphotos-f.ak.fbcdn.net/hphotos-ak-ash4/218904_176254849178191_1374097384_o.jpg" width="320" /></span></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
Both Osborne Motorsports and Lunacium Speed have teamed up to give away two (2) Traxxas gas RC cars. Follow @lunacium and @52OsborneRacing on twitter and share away to enter. When the accounts hit 1,000 followers each both RC cars will be given away with graphics to match the car pictured above.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
Th th th thats all Folks!</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
-Jake</div>
<span style="color: #2a2a2a;"><span style="line-height: 18px;"><br /></span></span>Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-27695775319604331802012-07-20T12:39:00.000-07:002012-07-20T12:39:20.801-07:00Lunacium Speed: Gear For GearheadsThe clothing line is closer to reality in spite of major set backs in finances and sourcing. To help things move forward I will be using Printfection initially and then hopefully move to production and distribution via better priced source. Printfection's prices are higher than I would want the shirts to sell for but it lets me maintain my commitment to quality and durable t shirt blanks. Gildan Ultra and American Apparel shirt blanks with direct to garment printing along with access to their entire color pallet. This will help me maintain the integrity of the Lunacium brand, collect some market research (ie what shirt designs sell and on what colors and what blanks) and get the clothing out there sooner.<br />
<br />
The account is setup as is the store and the products are entered but the store front hasn't been styled yet. I'm hoping to get to that this weekend through next week. After that I will start pushing the brand out via online marketing options, car show/event attendance, and of course word of mouth.<br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-4601058664387992772012-06-07T23:29:00.001-07:002012-06-07T23:29:13.937-07:00oopsSo apparently the testing I did on the new gallery didn't actually survive to the live site. A friend pointed out some issues he saw in FireFox and I hadn't even bothered to test in IE, I knew it was probably broken to start with!<br /><br />So, I have just spent several hours going through and figuring out the problem and it all came down to a single line of code. The reason why the body {background} would break the whole gallery is beyond me but I ended up having to target FireFox and IE uniquely with a background-color while Chrome can actually display the gallery the way I intended it. Whew.<br />
<br />
Anyway, the gallery skin is where the changes reside so in the future, as long as I keep the skin files intact, I can skip all this hoopla and just make updates!<br />
<br />
-Jake<br />
<br />
PS: Please let me know if anyone see anything broken in any of the main three browsers, thanks!Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-87335725901580020162012-06-07T00:33:00.004-07:002012-06-07T00:33:37.348-07:00been to long...Ok, so the first big news is some MASSIVE updates to the portfolio page. Lots of new content there including the shirts for the sub brand Lunacium Speed that I've been working on. Some new stuff and some old stuff and some big stuff like car wraps too. Take a look.<br />
<br />
On the Lunacium Speed front, I've had a little set back on the financial side and I won't make my launch date of the 4th of July weekend but I hope to still get the line off the ground mid summer. Watch for updates.<br />
<br />
-Jake<br />
<br />Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-45785203945084798642012-02-23T13:43:00.001-08:002012-02-23T13:43:06.878-08:00Shirts are out for bidding!<b>Lunacium:</b> <i>Speed </i>is one step closer to reality! I've contacted some companies to get bids on my shirt design to officially launch my line of shirts. Here is a list of the shirts that will be part of my initial launch, <u>six designs</u> in all.<br />
<br />
Design 1 '<b>Wire Wings</b>' <br />
Placement: Back (with a 4" square logo
on the front, centered on the chest.)<br />
<a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v4.png" target="_blank">http://i281.photobucket.com/<wbr></wbr>albums/kk224/panelrodder/<wbr></wbr>Design%20Projects/Lunacium%<wbr></wbr>20Speed%20Gear/v4.png</a><br />
<br />Design 2 - '<b>Motor Running</b>'<br /> Placement: Front<br /> <a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1-4.png" target="_blank">http://i281.photobucket.com/<wbr></wbr>albums/kk224/panelrodder/<wbr></wbr>Design%20Projects/Lunacium%<wbr></wbr>20Speed%20Gear/v1-4.png</a><br />
<br />Design 3 - <b>'Twins, Basil</b><span><em>'</em></span><br /> Placement: Front<br /> <a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1-6.png" target="_blank">http://i281.photobucket.com/<wbr></wbr>albums/kk224/panelrodder/<wbr></wbr>Design%20Projects/Lunacium%<wbr></wbr>20Speed%20Gear/v1-6.png</a><br />
<br />Design 4 - '<b>BJ</b>'<br /> Placement: Front <br /> <a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1-7.jpg" target="_blank">http://i281.photobucket.com/<wbr></wbr>albums/kk224/panelrodder/<wbr></wbr>Design%20Projects/Lunacium%<wbr></wbr>20Speed%20Gear/v1-7.jpg</a><br />
<br />Design 5 - '<b>Cardiac</b>'<br /> Placement Front <br /> <a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v3-2.png" target="_blank">http://i281.photobucket.com/<wbr></wbr>albums/kk224/panelrodder/<wbr></wbr>Design%20Projects/Lunacium%<wbr></wbr>20Speed%20Gear/v3-2.png</a> <br />
<br />Design 6 - '<b>Wrench & Repeat</b>'<br /> Placement: Front<br /> <a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1-1.png" target="_blank">http://i281.photobucket.com/<wbr></wbr>albums/kk224/panelrodder/<wbr></wbr>Design%20Projects/Lunacium%<wbr></wbr>20Speed%20Gear/v1-1.png</a><br />
<br />
The shirts will be available as <i>black printing</i> on <i>white shirts</i> and possibly with <i>red </i>and <i>blue </i>shirts being part of the initial launch as well <u>depending on pricing</u>. All the designs are intended to include <i>printed care tags</i> on the inside back of the collar and <i>sewn on hem tags</i> on the bottom hem line. <br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-41500549542493618602012-01-31T16:58:00.001-08:002012-01-31T16:58:58.940-08:00Time for a new shirt design, and here it is:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1-7.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1-7.jpg" width="247" /></a></div>
<br />
<br />Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-20733380143454527812011-12-06T22:16:00.003-08:002011-12-06T22:24:36.012-08:00I have been working with RawData's, <a href="http://www.therawdata.com/">www.therawdata.com</a>, CTO on the visuals for the next generation of our MoARC, Mobile Audio Recognition Client, application for the Android mobile OS while simultaneously working on the visuals for our survey app, I'm calling it QQs for Quick Question Surveys. Both apps will have nearly the same splash screen with only the app name swapped out. Here are my initial mockups for both.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuzFfC_ePCoAS4Ulzwwz3yHAgIFlbc8AP5HFUpRl-zPnkzqkaLFGbH4CILPDvTGsqMBJH4qEJrYOTIbZzKdM-hMExy2OBX_OalywLfKANb8x-eFc5q3QbUEKXAy2-bQeH2hr3i4hZhI4A/s1600/splashMock_v1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuzFfC_ePCoAS4Ulzwwz3yHAgIFlbc8AP5HFUpRl-zPnkzqkaLFGbH4CILPDvTGsqMBJH4qEJrYOTIbZzKdM-hMExy2OBX_OalywLfKANb8x-eFc5q3QbUEKXAy2-bQeH2hr3i4hZhI4A/s320/splashMock_v1.jpg" width="192" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxbCAAe_8dY9J4hK8hk3AAmnLeZznlpl672Covfkk7-p4TQPEZU5lmb0Nu9YGJxNHzN7Nhtt0fX-Zy3LqyfWECVKXGCmI5IuoOrL_jEqsM-WYlxxFGEsEGhPqa-syXH04Glh_oLCNKbRc/s1600/splash.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxbCAAe_8dY9J4hK8hk3AAmnLeZznlpl672Covfkk7-p4TQPEZU5lmb0Nu9YGJxNHzN7Nhtt0fX-Zy3LqyfWECVKXGCmI5IuoOrL_jEqsM-WYlxxFGEsEGhPqa-syXH04Glh_oLCNKbRc/s320/splash.jpg" width="192" /></a></div>
Again, these are nothing more than the simple splash screens shown only while the program loads and both will go to unique landing pages that help the users into the apps and its' features. Those screens are forth coming.<br />
<br />
Also, in VERY big news... at least for me... I am designing a promotional iOS app for the NBA team the Utah Jazz! My good friend will be doing the coding and development based on my designs! As I make progress on this I will be posting mockups here as well.<br />
<br />
-Jake<br />
<br />Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-6123462407924387942011-10-24T15:51:00.000-07:002011-10-24T15:51:28.211-07:00Some new shirt designs:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v4.png" width="247" /></a></div>
Titled 'Wire Wings'<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v2.png" width="247" /></a></div>
<br />
Titled 'Skullburator'<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v2-1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v2-1.png" width="247" /></a></div>
Titled 'Oil Bag'Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-85539939511989152872011-10-20T10:15:00.001-07:002011-10-20T10:15:41.913-07:00WrenchFistDid up another tshirt design recently. While browsing the web one day I found a shirt that had a new style that I liked a lot so I wanted to try it and this is what I came up with.<div>
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1-1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1-1.png" width="247" /></a></div>
<div>
What do you think? Would you wear it??</div>
<div>
<br /></div>
<div>
-Jake</div>Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-84924294964066860992011-09-21T00:55:00.000-07:002011-09-21T00:56:11.506-07:00Wire Wings t-shirt teaserI've been working on a tshirt design for a long time and I've finally made the jump to starting the digital work on it. Here is a teaser of the base work that has been done so far. I'm calling it the 'Wire Wings' for now.
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Lunacium%20Speed%20Gear/v1.jpg" width="313" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
Hope you like it! More to come on this for sure.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
-Jake</div>
<br />Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-6052656793331058432011-09-15T12:25:00.000-07:002011-09-15T12:27:39.765-07:00RawData Web ProjectAs promised, though a couple days slow, here is a link to the RawData website which went live earlier this week.<br />
<br />
<a href="http://therawdata.com/" target="_blank">http://therawdata.com/</a><br />
<br />
There are some holes in the site as far as database integration but that is not what I was responsible for. There is also some bigger functionality stuff that will be revised in the near future but for now here it is!<br />
<br />
-Jake<br />
<br />
(Here is a screen shot of the home page.)<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg17ArUNNv36QFW48RiHsFMFt6vzEw0_FJ00CJBprlEbtth2uiRF4U3BkKgQXxWwt3JBHjFpFvrHzTfU2akuTLvPX72PfqT1tvb-bybfcaNJyIQU7NXlxKaSVuGej_9ibEzwVNwsTcFiUQ/s1600/RawData-+Look%2527er.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="165" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg17ArUNNv36QFW48RiHsFMFt6vzEw0_FJ00CJBprlEbtth2uiRF4U3BkKgQXxWwt3JBHjFpFvrHzTfU2akuTLvPX72PfqT1tvb-bybfcaNJyIQU7NXlxKaSVuGej_9ibEzwVNwsTcFiUQ/s320/RawData-+Look%2527er.png" width="320" /></a></div>
<br />Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-68091352553298022552011-09-06T18:49:00.000-07:002011-09-06T18:49:23.789-07:00Quick update, I've been cramming on the previously posted RawData website. The site design was completed awhile back and then we started development but had to fire the development company when they didn't actually do anything do anything after multiple weeks. Now I'm taking a more active role by doing the front end coding as well as the original design. When the site goes live look for a link.<br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-15374431104306466122011-08-10T15:07:00.000-07:002011-08-10T15:07:43.570-07:00Photochopped LarryBeen working on figuring out and learning a new technique for 'photochopping' a car.<br />
<br />
Here is the base photo:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Larry2%201961%20Chevy%20Suburban/IMG_20110706_192105.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Larry2%201961%20Chevy%20Suburban/IMG_20110706_192105.jpg" width="320" /></a></div><br />
Here is stage one in progress:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Larry2%201961%20Chevy%20Suburban/mockV1_inprogress.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="212" src="http://i281.photobucket.com/albums/kk224/panelrodder/Larry2%201961%20Chevy%20Suburban/mockV1_inprogress.jpg" width="320" /></a></div><br />
And here it is currently:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Larry2%201961%20Chevy%20Suburban/mockV2_inprogress.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="212" src="http://i281.photobucket.com/albums/kk224/panelrodder/Larry2%201961%20Chevy%20Suburban/mockV2_inprogress.jpg" width="320" /></a></div><br />
I plan to white out the grill and headlight bezels and see what I think. Then I will flatten it all, add some noise, and try putting it on a different background.<br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-16117542686758764382011-08-02T13:18:00.000-07:002011-08-02T13:18:26.371-07:00Been awhile and needed a new skullhere is my newest skull design:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/IMG_20110802_141135.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/IMG_20110802_141135.jpg" width="240" /></a></div>I originally did this design a few years back I recently wanted to do a more Adobe Illustrator friendly version so I put this together. Shortly I hope to actually put this in Illustrator and do a digital version.<br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-87351083028328112652011-06-13T11:03:00.000-07:002011-06-13T11:03:43.244-07:00Hotrod Wagon that is Hotrod doneAwhile back this itch crept up on me to build a hotrod wagon for my 1 1/2 old son. He has a little plastic wagon that he liked to be pulled around in but he is already wayyyy to big for it.<br />
<br />
This is what I started with:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Western%20Flyer%20Rocket%20Wagon/IMG_20110425_084218.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Western%20Flyer%20Rocket%20Wagon/IMG_20110425_084218.jpg" width="320" /></a></div><br />
<br />
<br />
And this is what I built:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Western%20Flyer%20Rocket%20Wagon/IMG_20110610_071513.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Western%20Flyer%20Rocket%20Wagon/IMG_20110610_071513.jpg" width="320" /></a></div><br />
My son really likes to ride around in the wagon. Here is a pic of him just last night after we had taken three different walks around the neighborhood!<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Western%20Flyer%20Rocket%20Wagon/IMG_20110612_195823.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Western%20Flyer%20Rocket%20Wagon/IMG_20110612_195823.jpg" width="320" /></a></div><br />
The wagon was over built to handle the future terror that he will rain down upon it so its a bit heavy for him right now, here is a pic of him attempting to move it on grass!<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Western%20Flyer%20Rocket%20Wagon/IMG_20110612_200037.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Western%20Flyer%20Rocket%20Wagon/IMG_20110612_200037.jpg" width="320" /></a></div><br />
And apparently he got the urge to look like Kareem Abdul Jabbar while riding and busted out my protective eye wear.<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Misc/IMG_20110612_200415.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Misc/IMG_20110612_200415.jpg" width="320" /></a></div><br />
Had to throw this out there but I promise I'll get back to other design stuff!<br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-33070170690616778262011-06-09T08:34:00.000-07:002011-06-09T08:34:03.553-07:00Bullet holes, rivets, and a smashed skullSo my friends and I liked the smashed skull image so much that I added our motor club name to it and then built a custom wallpaper.<br />
<br />
Ta Da!<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/wwIIPlane_v2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="214" src="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/wwIIPlane_v2.png" width="320" /></a></div><br />
<br />
I also began working on a new skull design that isn't for anything in particular other than fun... or maybe a shirt....<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/longtooth_v1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/longtooth_v1.jpg" width="247" /></a></div>-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-87425467146158849342011-06-06T14:00:00.000-07:002011-06-06T14:57:24.431-07:00Hammered Skull v2<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/IMG_20110606_145659.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/IMG_20110606_145659.jpg" width="320" /></a></div><br />
Here is a newer version which so far is by far my favorite!<br />
<br />
-Jake<br />
<br />
<br />
Edit:<br />
<br />
Here is the design after digitalization:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/v2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="287" src="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/v2.jpg" width="320" /></a></div>Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-62727106734235162792011-06-06T12:20:00.000-07:002011-06-06T12:35:06.085-07:00Hammered SkullA new doodle of my anvil smashed skull.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/IMG_20110606_133300.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Drawings/IMG_20110606_133300.jpg" width="320" /></a></div><br />
<div class="separator" style="clear: both; text-align: center;"><br />
</div>Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-53665914032589668362011-06-01T14:48:00.000-07:002011-06-01T14:48:07.329-07:00A little sadistic bad luckHad an idea rattling around in my head for the last few days and I finally decided to build it. The illustration goes along with the idea of The Luckless, here it is:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Luckless/v2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="308" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Luckless/v2.jpg" width="400" /></a></div><div class="separator" style="clear: both; text-align: center;"><br />
</div><div class="separator" style="clear: both; text-align: left;">I had fun putting this one together! I actually built the skull out of pieces to get the right angle on it and also to get the jaw jacked out like that. I'd probably wear that on a shirt!</div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;">This will be an evolving design as you are seeing it in version 1.0 so stay tuned for updates to it.</div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;">-Jake</div>Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-83900953348506126922011-05-31T13:46:00.000-07:002011-05-31T13:46:52.047-07:00Skull Appreciation Day!<pre style="white-space: pre-wrap; word-wrap: break-word;"></pre><br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://skulladay.blogspot.com/2010/06/skull-appreciation-day.html" style="margin-left: 1em; margin-right: 1em;"><img src="http://www.spacepirate.org/skulladay/sad.gif" /></a></div><br />
<br />
<br />
I have been following the blog over at skulladay.blogspot.com and love the work they are doing and have been considering doing my on 365 day project. (more info on that <a href="http://makesomething365.blogspot.com/">here</a>). SkullADay has declared June 4th 'Skull Appreciation Day'. Click the image above to get some more info and also to see the work happening on that site. Great creative stuff that is also inspiring!<br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-18269620764406336002011-05-26T14:47:00.000-07:002011-05-26T14:47:22.839-07:00Could have waited but didn'tSo I know I've done a large number of posts in a short amount of time but I just had to share this piece.<br />
<br />
This is the newest and what I could consider almost totally finished version of the new The Luckless logo.<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Luckless/luckless_logo_blacks-1.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="135" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/Luckless/luckless_logo_blacks-1.jpg" width="400" /></a></div><div class="separator" style="clear: both; text-align: center;"><br />
</div><div class="separator" style="clear: both; text-align: center;"><br />
</div><div class="separator" style="clear: both; text-align: left;">Hope you enjoy it as much as I do!</div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;">-Jake</div>Panelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-67525722554305361082011-05-26T09:15:00.000-07:002011-05-26T09:15:43.085-07:00"Branding Ninja" - my new titleMy father took on a new job a year or so ago. The job was with a startup called Raw Data and involved some pretty amazing goals that required equally amazing levels of development skills and talent, both of which my dad has plenty of! Well the company made some awesome progress over the last year and, unlike Matchplay in a previous post, they have continued to grow and flourish. I was approched by the CEO about coming on in a branding capacity. This isn't a regular job and I only earn equity in the company for my efforts but the opportunity is one that is pretty incredible for any designer this early in his/her career so I accepted. With the new side job I also got a new title... but its one I got to CHOOSE! So I am the 'Branding Ninja' for Raw Data in Salt Lake City, Utah.<br />
<br />
My first move was to sneak up on and judo chop the logo. The logo was designed early on and while solid had some fundamental problems. Here is a comparison of the original and my modified version:<br />
<br />
Original:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://www.therawdata.com/App_Themes/Images/RawDataLogov9b.gif" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="74" src="http://www.therawdata.com/App_Themes/Images/RawDataLogov9b.gif" width="320" /></a></div><br />
<br />
<br />
<br />
<br />
<br />
<br />
My first edit (top) and my second edit (bottom):<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/RawData/logoComparision.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="240" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/RawData/logoComparision.jpg" width="320" /></a></div><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
It was important to me to add some visual weight to the mark and also to tighten up kerning of the lettering. There is still some work that can be done on the kerning but this is pretty close. I also wanted to flip the divider/underline bar so that instead of dropping down and then to the left it dropped down and then swiped to the right. In the west we read left to right and have a sense that moving forward means to move to the right from the left. Having the line the way it was suggested, even subconsciously, that RawData was moving backwards and they are doing anything but that!<br />
<br />
The website is also under construction. We started with a registered user section since the major reason for the site is to facilitate the dissemination of info to and to assist the registered users. After that it is to inform potential user. Here is the page that I've title 'Panelist'er' (since our registered users are actually members of a user panel):<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/RawData/panelist_v1_proof.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/RawData/panelist_v1_proof.png" width="178" /></a></div><br />
<br />
The column on the left is a blog format panel that allows Raw Data to post information to and for the general population of the panel.<br />
<br />
The column on the right is specific to the panelist and allows the user to see and manage their account, settings, see usage stats, and provides direct links to the panelist to communicate with Raw Data.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
The second page, as mentioned, is an informational page designed to inform and inspire prospective panelists, a page I've titled 'Prospect'er':<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/RawData/prospect_v1_proof.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/RawData/prospect_v1_proof.png" width="264" /></a></div><br />
<br />
Similar to the panelist page, I have use a three column layout with the column on the far left being a quick reference column and the two on the right being combined into one and used to provide the more detailed break down of what is required to be a panelist.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
The project is based on a concept of washing away the old archaic way of doing things with a digital, streamlined, and more fluid solution. To visualize this I used a white wash idea of Raw Data and its process flowing down and over the old way of doing things, which is represented by the orange color filled with blurred and cluttered spread sheets, the current standard in the industry. The fluidity of RawData is conveyed to the viewer by the flowing liquid but the rigid three column and very geometric shapes of the body of each page shows the predictability of the data format that you can expect from RawData.<br />
<br />
<br />
This in an ongoing project and changes will happen and more pages will be added, I hope to provide samples here as I complete pages.<br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0tag:blogger.com,1999:blog-1130117103547257668.post-85555306406088826552011-05-26T08:47:00.000-07:002011-05-26T08:47:46.963-07:00MatchPlay Identity & Site DesignA good friend passed my name along to a guy he knew that was interested in building a website that provided stats tracking for rec. or comp. teams for youth sports. The site was based off a system that his grandfather had developed through years of involvement in youth sports but was totally paper based. My task was to update the brand and design the initial website, front end, design.<br />
<br />
Here is the mark in its updated form:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/MatchPlay/logo_v2_P1.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="320" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/MatchPlay/logo_v2_P1.jpg" width="246" /></a></div><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
(I always display my mark designs the way I did in college, with a full sized version in color followed by the same mark in reduction and in black and white.)<br />
<br />
<br />
<br />
Here is the site design. Keep in mind that this is the first iteration of the site and ultimately the company failed to take off and the project was killed so this is as far as it went. I put it here because it shows an early step in my process and hopefully you can see the direction I was taking it. The developer and the owner of the idea were both thrilled with the design and concept.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/MatchPlay/siteFrontEnd_v1-p1.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="198" src="http://i281.photobucket.com/albums/kk224/panelrodder/Design%20Projects/MatchPlay/siteFrontEnd_v1-p1.jpg" width="320" /></a></div><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
Like I said the company ran into some logistical and financial issues so this project, unfortunately, didn't come to total fruition.<br />
<br />
<br />
-JakePanelrodderhttp://www.blogger.com/profile/15819585625921613898noreply@blogger.com0