http://work.jstkrs.com Kris LoCascio || Art Director & Internet Enthusiast Tue, 21 Feb 2012 08:20:55 +0000 http://work.jstkrs.com en http://work.jstkrs.com/Nicki-Cozzolino http://work.jstkrs.com/following/work.jstkrs.com/Nicki-Cozzolino Tue, 21 Feb 2012 08:20:55 +0000 Kris LoCascio || Art Director & Internet Enthusiast 2850955 For Nicki's debut women's line she wanted to create a website that showcased not only the clothes but the expression behind them. We worked together to create both the website and the introduction video to launch the fall line. <img src="http://payload27.cargocollective.com/1/0/29603/2850955/visitsite.png" width="109" height="59" width_o="109" height_o="59" src_o="http://payload27.cargocollective.com/1/0/29603/2850955/visitsite_o.png" data-mid="16492384" border="0" align="left"/> Autumn/Winter 2012 Update Intro Video: Fall Homepage Refresh: <img src="http://payload27.cargocollective.com/1/0/29603/2850955/nc-fall1.jpg" width="670" height="409" width_o="670" height_o="409" src_o="http://payload27.cargocollective.com/1/0/29603/2850955/nc-fall1_o.jpg" data-mid="15760959" border="0" align="left"/><img src="http://payload27.cargocollective.com/1/0/29603/2850955/nc-fall2.jpg" width="670" height="409" width_o="670" height_o="409" src_o="http://payload27.cargocollective.com/1/0/29603/2850955/nc-fall2_o.jpg" data-mid="15760960" border="0" align="left"/><img src="http://payload27.cargocollective.com/1/0/29603/2850955/nc-fall3.jpg" width="670" height="409" width_o="670" height_o="409" src_o="http://payload27.cargocollective.com/1/0/29603/2850955/nc-fall3_o.jpg" data-mid="15760961" border="0" align="left"/> Spring/Summer 2012 <img src="http://payload27.cargocollective.com/1/0/29603/2850955/nicki1.jpg" width="670" height="408" width_o="670" height_o="408" src_o="http://payload27.cargocollective.com/1/0/29603/2850955/nicki1_o.jpg" data-mid="14491864" border="0" align="left"/><img src="http://payload27.cargocollective.com/1/0/29603/2850955/nicki2.jpg" width="670" height="408" width_o="670" height_o="408" src_o="http://payload27.cargocollective.com/1/0/29603/2850955/nicki2_o.jpg" data-mid="14491866" border="0" align="left"/><img src="http://payload27.cargocollective.com/1/0/29603/2850955/nicki3.jpg" width="670" height="408" width_o="670" height_o="408" src_o="http://payload27.cargocollective.com/1/0/29603/2850955/nicki3_o.jpg" data-mid="14491867" border="0" align="left"/> http://work.jstkrs.com/Heartbeat-Ideas http://work.jstkrs.com/following/work.jstkrs.com/Heartbeat-Ideas Wed, 21 Dec 2011 21:21:05 +0000 Kris LoCascio || Art Director & Internet Enthusiast 2491586 Our new website is the last piece in our rebranding effort. We created this site to represent our new vision for our agency. Built as a partially responsive design (with a separate smartphone experience). We leveraged the powers of javascript and css to deliver a cleaner more engaging web presence. Role: Art Director <img src="http://payload9.cargocollective.com/1/0/29603/2491586/visitsite.png" width="109" height="59" width_o="109" height_o="59" src_o="http://payload9.cargocollective.com/1/0/29603/2491586/visitsite_o.png" data-mid="16492399" border="0" align="left"/> <img src="http://payload9.cargocollective.com/1/0/29603/2491586/HI-_0000_1.jpg" width="670" height="350" width_o="670" height_o="350" src_o="http://payload9.cargocollective.com/1/0/29603/2491586/HI-_0000_1_o.jpg" data-mid="12565433" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491586/HI-_0001_2.jpg" width="670" height="479" width_o="670" height_o="479" src_o="http://payload9.cargocollective.com/1/0/29603/2491586/HI-_0001_2_o.jpg" data-mid="12565434" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491586/HI-_0002_3.jpg" width="670" height="680" width_o="670" height_o="680" src_o="http://payload9.cargocollective.com/1/0/29603/2491586/HI-_0002_3_o.jpg" data-mid="12565435" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491586/HI-_0003_4.jpg" width="670" height="834" width_o="670" height_o="834" src_o="http://payload9.cargocollective.com/1/0/29603/2491586/HI-_0003_4_o.jpg" data-mid="12565436" border="0" align="left"/> http://work.jstkrs.com/Holiday-GIFaway http://work.jstkrs.com/following/work.jstkrs.com/Holiday-GIFaway Wed, 21 Dec 2011 20:54:57 +0000 Kris LoCascio || Art Director & Internet Enthusiast 2491399 This year we wanted to have fun with our holiday card and get away from computers for a while. We wrapped the corner of our office and got to work. The premise: create a bunch of holiday related animated GIFs and raise money for charity. Each GIF you unwrap dontates a different amount of money to onelaptopperchild.org. We used our 3 main colors and started creating scenes, from an angry nutcracker to neverending unwrapping. Each one was shot with an iPhone and stitched together with a combo of gifshop.tv and photoshop. <img src="http://payload9.cargocollective.com/1/0/29603/2491399/visitsite.png" width="109" height="59" width_o="109" height_o="59" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/visitsite_o.png" data-mid="16492419" border="0" align="left"/> <img src="http://payload9.cargocollective.com/1/0/29603/2491399/HolidayCard-120111.jpg" width="670" height="450" width_o="670" height_o="450" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/HolidayCard-120111_o.jpg" data-mid="12564648" border="0" align="left"/> Here are all the GIFs: <img src="http://payload9.cargocollective.com/1/0/29603/2491399/1-Nutcracker.gif" width="300" height="225" width_o="300" height_o="225" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/1-Nutcracker_o.gif" data-mid="12564871" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491399/2-Champagne.gif" width="300" height="225" width_o="300" height_o="225" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/2-Champagne_o.gif" data-mid="12564873" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491399/3-Wrapping.gif" width="300" height="225" width_o="300" height_o="225" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/3-Wrapping_o.gif" data-mid="12564874" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491399/4-Fishing.gif" width="300" height="225" width_o="300" height_o="225" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/4-Fishing_o.gif" data-mid="12564875" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491399/5-ChineseFood.gif" width="300" height="225" width_o="300" height_o="225" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/5-ChineseFood_o.gif" data-mid="12564876" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491399/6-Snowglobe.gif" width="300" height="225" width_o="300" height_o="225" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/6-Snowglobe_o.gif" data-mid="12564877" border="0" align="left"/><img src="http://payload9.cargocollective.com/1/0/29603/2491399/7-Snoops.gif" width="300" height="225" width_o="300" height_o="225" src_o="http://payload9.cargocollective.com/1/0/29603/2491399/7-Snoops_o.gif" data-mid="12564880" border="0" align="left"/> http://work.jstkrs.com/The-Heartbeat-Approach http://work.jstkrs.com/following/work.jstkrs.com/The-Heartbeat-Approach Thu, 20 Oct 2011 16:48:27 +0000 Kris LoCascio || Art Director & Internet Enthusiast 2179734 As part of our brand refresh, we wanted to tell the story of how we work with a case study. We created this video to show how we use our suite of strategic tools to help inform our decisions and better deliver focused results to our clients. Role: Art Director Creative Director: Grace Magarelli Animator/Motion Graphics: Bran Dougherty-Johnson http://work.jstkrs.com/Heartbeat-Office-Space http://work.jstkrs.com/following/work.jstkrs.com/Heartbeat-Office-Space Thu, 20 Oct 2011 16:43:43 +0000 Kris LoCascio || Art Director & Internet Enthusiast 2179679 When Heartbeat moved from midtown to tribeca, we didnt just change locations but we redefined our mission as well as our branding. Our new space filled with space and light was a big part of this new positioning. We created this stop motion video to show the new space and explain a little bit about the design choices. Role: Art Director, Photographer, Editor Creative Director: Grace Magarelli http://work.jstkrs.com/Holiday-Zeitgeist http://work.jstkrs.com/following/work.jstkrs.com/Holiday-Zeitgeist Wed, 09 Feb 2011 08:15:07 +0000 Kris LoCascio || Art Director & Internet Enthusiast 1036898 In 2009, my company came to me and asked if I had any ideas for the Holiday Card. With so many being sent around, I really wanted to use this opportunity to develop something that was interactive, personal, as well as dynamic, so we created the Holiday Zeitgeist. Sent in an email to our clients we asked what they wanted to give for the holidays, Health, Happiness, Prosperity or Growth. Based on the response we donated to a corresponding charity and allowed them to see what people were thinking about that holiday season in a grid made up of dynamic information pulled in from three feeds, twitter, flickr, and HBD. The twitter feed pulled in tweets related to the word they chose, flickr images that were tagged with the word were pulled, and the employees of Heartbeat were asked to contribute a response related to each of the keywords. <img src="http://payload.cargocollective.com/1/0/29603/1036898/visitsite_5.png" width="109" height="59" width_o="109" height_o="59" src_o="http://payload.cargocollective.com/1/0/29603/1036898/visitsite_5_o.png" data-mid="16492481" border="0" align="left"/> <img src="http://payload.cargocollective.com/1/0/29603/1036898/hb-1.jpg" width="670" height="403" width_o="1024" height_o="617" src_o="http://payload.cargocollective.com/1/0/29603/1036898/hb-1_o.jpg" data-mid="4978762" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1036898/hb-2.jpg" width="670" height="403" width_o="1024" height_o="617" src_o="http://payload.cargocollective.com/1/0/29603/1036898/hb-2_o.jpg" data-mid="4978763" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1036898/hb-3.jpg" width="670" height="403" width_o="1024" height_o="617" src_o="http://payload.cargocollective.com/1/0/29603/1036898/hb-3_o.jpg" data-mid="4978764" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1036898/hb-4.jpg" width="670" height="403" width_o="1024" height_o="617" src_o="http://payload.cargocollective.com/1/0/29603/1036898/hb-4_o.jpg" data-mid="4978765" border="0" align="left"/> http://work.jstkrs.com/Ricky-Restiano-Photography http://work.jstkrs.com/following/work.jstkrs.com/Ricky-Restiano-Photography Wed, 09 Feb 2011 07:42:27 +0000 Kris LoCascio || Art Director & Internet Enthusiast 1036829 Ricky has been shooting weddings for a long time and recently expanded his business to allow for more primary shooters and as a result he wanted to update his site. The goal was to upfront the three main photographers for the studio while putting a focus on the photos rather than design. So we created a layout that allows the images to take center stage while still allowing the user to navigate through the site. We created a slideshow for the homepage to site behind the navigation, and then once you click on a photographer, the background becomes a small loop of video related to the photographer on the job. From there you can see their 3 most recent albums and find out more about them through text and additional video. <img src="http://payload.cargocollective.com/1/0/29603/1036829/visitsite_5.png" width="109" height="59" width_o="109" height_o="59" src_o="http://payload.cargocollective.com/1/0/29603/1036829/visitsite_5_o.png" data-mid="16492469" border="0" align="left"/> <img src="http://payload.cargocollective.com/1/0/29603/1036829/kjl_0006_ricky.jpg" width="670" height="403" width_o="1024" height_o="616" src_o="http://payload.cargocollective.com/1/0/29603/1036829/kjl_0006_ricky_o.jpg" data-mid="4978581" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1036829/kjl_0006_ricky2.jpg" width="670" height="403" width_o="670" height_o="403" src_o="http://payload.cargocollective.com/1/0/29603/1036829/kjl_0006_ricky2_o.jpg" data-mid="5753537" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1036829/kjl_0006_ricky3.jpg" width="670" height="403" width_o="670" height_o="403" src_o="http://payload.cargocollective.com/1/0/29603/1036829/kjl_0006_ricky3_o.jpg" data-mid="5753539" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1036829/kjl_0006_ricky4.jpg" width="670" height="403" width_o="670" height_o="403" src_o="http://payload.cargocollective.com/1/0/29603/1036829/kjl_0006_ricky4_o.jpg" data-mid="5753540" border="0" align="left"/> http://work.jstkrs.com/Zevious-After-the-Air-Raid http://work.jstkrs.com/following/work.jstkrs.com/Zevious-After-the-Air-Raid Wed, 09 Feb 2011 07:18:46 +0000 Kris LoCascio || Art Director & Internet Enthusiast 1036772 For Zevious' album After the Air Raid, we set out to evolve the idea we started with in the first site. While the homepage represents the art that was created for the album, I wanted to create micro experiences that were offshoots of the site. This resulted in 2 interactive videos one for the song Coma Cluster and the other for the title track ATAR. The unifying idea was that each video would respond to keyboard commands. The letters, Z,E,V,I,O,U, & S would be the catalysts to create some sort of interaction within the video. For coma cluster, I was inspired to create a space scene of clusters of planet like shapes. I created a space scene out of photos I took mixed with pictures of space and allowed each key to mix up the video, from inverting it, to creating a kaleidoscope effect, each effect makes you see the music in a new light. For ATAR, I cut together a bunch of war videos to evoke the feeling that I had listening to the song the first time. I then added a layer of color over the video and allowed people to choose which color the video should be by using the keyboard commands. Each shade was meant to change the way you heard the song, and how you interpret the video. <img src="http://payload.cargocollective.com/1/0/29603/1036772/visitsite_4.png" width="109" height="59" width_o="109" height_o="59" src_o="http://payload.cargocollective.com/1/0/29603/1036772/visitsite_4_o.png" data-mid="16492464" border="0" align="left"/> <img src="http://payload.cargocollective.com/1/0/29603/1036772/kjl_0000_z1.jpg" width="670" height="403" width_o="1024" height_o="616" src_o="http://payload.cargocollective.com/1/0/29603/1036772/kjl_0000_z1_o.jpg" data-mid="4978431" border="0" align="left"/> Video for After the Air Raid. Footage from the internet archive. Part of an interactive experience exploring the effect of color and mood. <img src="http://payload.cargocollective.com/1/0/29603/1036772/18-Kris_LoCascio.jpg" width="670" height="502" width_o="1024" height_o="768" src_o="http://payload.cargocollective.com/1/0/29603/1036772/18-Kris_LoCascio_o.jpg" data-mid="4978945" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1036772/19-Kris_LoCascio.jpg" width="670" height="502" width_o="1024" height_o="768" src_o="http://payload.cargocollective.com/1/0/29603/1036772/19-Kris_LoCascio_o.jpg" data-mid="4978959" border="0" align="left"/> http://work.jstkrs.com/Heutchy http://work.jstkrs.com/following/work.jstkrs.com/Heutchy Wed, 09 Feb 2011 07:18:45 +0000 Kris LoCascio || Art Director & Internet Enthusiast 1035343 I have been working with Heutchy for a few years now, and through this time we have created several iterations of their look. Handling both web design and product shots I have come to appreciate the simple but classic approach to the brand. Never a lot of extraneous design, just simple approachable shoes. Each design has an interesting take on the brand so I am including three different sites to show the evolution over the last 3 years. <img src="http://payload.cargocollective.com/1/0/29603/1035343/visitsite_7.png" width="109" height="59" width_o="109" height_o="59" src_o="http://payload.cargocollective.com/1/0/29603/1035343/visitsite_7_o.png" data-mid="16492440" border="0" align="left"/> <img src="http://payload.cargocollective.com/1/0/29603/1035343/heutchy-new.jpg" width="670" height="403" width_o="670" height_o="403" src_o="http://payload.cargocollective.com/1/0/29603/1035343/heutchy-new_o.jpg" data-mid="9775215" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1035343/kjl_h2.jpg" width="670" height="403" width_o="1024" height_o="616" src_o="http://payload.cargocollective.com/1/0/29603/1035343/kjl_h2_o.jpg" data-mid="4977874" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1035343/kjl_h1.jpg" width="670" height="403" width_o="1024" height_o="616" src_o="http://payload.cargocollective.com/1/0/29603/1035343/kjl_h1_o.jpg" data-mid="4977873" border="0" align="left"/> As well as web design, I have also taken most of their marketing photography. For the GenArt Fresh Faces in Fashion show I helped them create a display of for the event inspired by a piece by Gerhard Richter. <img src="http://payload.cargocollective.com/1/0/29603/1035343/06-Kris_LoCascio.jpg" width="670" height="502" width_o="1024" height_o="768" src_o="http://payload.cargocollective.com/1/0/29603/1035343/06-Kris_LoCascio_o.jpg" data-mid="6205028" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29603/1035343/05-Kris_LoCascio.jpg" width="670" height="502" width_o="1024" height_o="768" src_o="http://payload.cargocollective.com/1/0/29603/1035343/05-Kris_LoCascio_o.jpg" data-mid="6205030" border="0" align="left"/>