Contact Christopher Kennedy

x Cancel
posted 1 year ago

Launched my side project: Grade Spotter

http://gradespotter.com/

I am the Design Co-founder on this project and I have been working with my Technical Co-founder on this side project for the last 3 months.

Grade Spotter is a full-featured restaurant inspection guide for your iPhone. Whether it’s a five-star restaurant or a hole-in-the-wall secret, each New York City restaurant must adhere to a standard of rules and regulations when dealing with food. With over 24,000 restaurants in the city one must question a restaurant’s sanitary principles at one point or another. Separate from taste and appearance, what food actually deserves an A and what food should be thrown in the garbage? Grade Spotter provides the NYC Health Department Restaurant Inspection Grades in a one-stop, user-friendly format and helps you make an informed decision on where to go.

11 View ▸
posted 1 year ago

NYC Grades - Restaurant Page

I am currently building an iPhone app with @rowens to quickly find the reasons behind the grades in the restaurants of NYC. I just finished the restaurant page and looking to get feedback. ## Here are my thoughts. The top part will show the current restaurant you are looking at. If you click the map it will open up the maps app. I also left extra room so if the name has to expand, it can, into two lines. Then I brake it down into two different sections, Graded & Ungraded. This is where I am trying to eliminate as much confusion as I can. The grades are based off points. Grade A: 0 to 13 points for sanitary violations. Grade B: 14 to 27 points for sanitary violations. Grade C: 28 or more points for sanitary violations. But you will only see graded inspections with grades. Sounds simple, right. Then there is the ungraded inspections, which just shows the points. So I figured that I would show the grade color behind the points. Grade A: Blue Grade B: Green Grade C: Orange I thought the date was also a very important detail. As you can see from the example Per Se has 41 points ungraded a few weeks ago, but over a year ago it was given 8 points graded which it will display as its current grade. ### Give credit where it’s due White iPhone by Marshall Bock: http://dribbble.com/shots/305076-iPhone-4S-Template Wood Texture by Subtle Patterns: http://subtlepatterns.com/?p=904 #### Landing page [nycgrades.co](http://nycgrades.co)

I am currently building an iPhone app with @rowens to quickly find the reasons behind the grades in the restaurants of NYC. I just finished the restaurant page and looking to get feedback.

Here are my thoughts.

The top part will show the current restaurant you are looking at. If you click the map it will open up the maps app. I also left extra room so if the name has to expand, it can, into two lines.

Then I brake it down into two different sections, Graded & Ungraded. This is where I am trying to eliminate as much confusion as I can. The grades are based off points.

Grade A: 0 to 13 points for sanitary violations.
Grade B: 14 to 27 points for sanitary violations.
Grade C: 28 or more points for sanitary violations.

But you will only see graded inspections with grades. Sounds simple, right. Then there is the ungraded inspections, which just shows the points. So I figured that I would show the grade color behind the points.

Grade A: Blue
Grade B: Green
Grade C: Orange

I thought the date was also a very important detail. As you can see from the example Per Se has 41 points ungraded a few weeks ago, but over a year ago it was given 8 points graded which it will display as its current grade.

Give credit where it’s due

White iPhone by Marshall Bock: dribbble.com/shots/…
Wood Texture by Subtle Patterns: subtlepatterns.com/

Landing page

nycgrades.co

7 View ▸
posted 2 years ago

Flip Clock

So I am trying out my UI skills. I figured I would start with something traditional. I spent about one hour in photoshop working on this. Please let me know your thoughts.

So I am trying out my UI skills. I figured I would start with something traditional. I spent about one hour in photoshop working on this. Please let me know your thoughts.

3 View ▸
posted 2 years ago

Lemonade Stand Redesign v2.0

Now that we have a little more time and a steady internet connection off the StartupBus we decided a redesign was in order. I have deiced to get rid of the wood because although it went with the idea it did not flow very well and plus it is over used. I want the main focus to be that we are a mobile app (screenshots will change). I plan on using a mixture of @sawyer [Depth of Field](http://forrst.com/posts/CSS3_Depth_of_Field-4zh) & @chriscoyier [Remote Linking](http://css-tricks.com/examples/RemoteLinking/), so when you hover over the download buttons, which are inspired from @CReber [Wunderlist Web App](http://www.wunderlist.com/), that particular phone will come to the front and tossing the other phone in the back. I was thinking of making the screen shots maybe a QR code so it will be easier to download to your phone. After that we flow into some information about the app. We tell you a little about the two main functions of the app and then we offer a little video. I kept the nav at the bottom, as I think it should not be the main focus on this site. The yellow button is the hover state on both the navigation and download. Please let me know your thoughts. I look forward to hearing from you. Credit: The icons are from [iconSweets2](http://www.iconsweets2.com/)

Now that we have a little more time and a steady internet connection off the StartupBus we decided a redesign was in order. I have deiced to get rid of the wood because although it went with the idea it did not flow very well and plus it is over used.

I want the main focus to be that we are a mobile app (screenshots will change). I plan on using a mixture of @sawyer Depth of Field & @chriscoyier Remote Linking, so when you hover over the download buttons, which are inspired from @CReber Wunderlist Web App, that particular phone will come to the front and tossing the other phone in the back. I was thinking of making the screen shots maybe a QR code so it will be easier to download to your phone.

After that we flow into some information about the app. We tell you a little about the two main functions of the app and then we offer a little video. I kept the nav at the bottom, as I think it should not be the main focus on this site. The yellow button is the hover state on both the navigation and download.

Please let me know your thoughts. I look forward to hearing from you.

Credit: The icons are from iconSweets2

13 View ▸
posted 2 years ago

KQ Webshow

I am helping a good friend of mine build his online presence. He is a professional DJ for a radio station and we had the idea for starting a podcast. Here is the landing page I created while we further develop the idea. What do you guys think of the overall design?

I am helping a good friend of mine build his online presence. He is a professional DJ for a radio station and we had the idea for starting a podcast. Here is the landing page I created while we further develop the idea. What do you guys think of the overall design?

3 View ▸
posted 3 years ago

Marketing Button

                <style type="text/css">
.market{
    background-color: #2daebf;
    border-top: 1px solid rgba(0255,255,255,0.7);
    border-bottom: 1px solid rgba(0,0,0,0.2);
    color: #fff; 
    cursor: pointer;
    display: inline-block; 
    font-size:14px;
    font-family:"Lucida Grande",Verdana,Helvetica,Arial,sans-serif;
    font-weight:bold;
    padding: 6px 10px 6px;
    position: relative;
    text-decoration: none;
    text-shadow: 1px 1px 0px rgba(0,0,0,0.2);
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px;
    width:90px;
    
    /* button color change */
    -webkit-transition: background-color .2s linear;
    -moz-transition:background-color .2s linear;
    -o-transition:background-color .2s linear;
    transition:background-color .2s linear;
    
    /* shadow pulse */
    -webkit-animation-name: pulse;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-direction: alternate
}
@-webkit-keyframes pulse{
	0%{
		box-shadow:0 0 1px rgba(197,95,0,0.9);
		-moz-box-shadow:0 0 1px rgba(15, 232, 255, 0.9);
		-webkit-box-shadow:0 0 1px rgba(197, 95, 0, 0.4);
	}
	100%{
		box-shadow:0 0 10px rgba(197,95,0,0.7);
		-moz-box-shadow:0 0 15px rgba(197, 95, 0, 0.7);
		-webkit-box-shadow:0 0 15px rgba(15, 232, 255, 0.6);
	}
}
.market:hover{
	background-color: #007d9a;
	color: #fff;
	transition:background-color .2s linear;
	-moz-transition:background-color .2s linear;
	-o-transition:background-color .2s linear;
	-webkit-transition: background-color .2s linear;
}
.market:active{
	top: 1px;
}
.market span{
	-webkit-animation-name: arrow;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-direction: alternate;
}
@-webkit-keyframes arrow {
	 from {
	   margin:0 0 0 0;
	 }
	 to {
	   margin:0 0 0 4px;
	 }
}
</style>

<p><a href="#" class="market">Buy Now <span>»</span></a></p>
Raw

I had an idea for a simple marketing button and this is my rough draft. Nothing like a pulsing & moving button to get the users attention. Oblivious best viewed in a webkit browser. You can find a working example here: jsfiddle.net/GsYjm/

1 View ▸
posted 3 years ago

Beer Poster

I had this idea the other day to make some posters of what is in beer. The finished goal would be to have single beer poster and one large poster with all the beers. I would like to approach a craft brewery such as DogFish with this idea and base the content of the beer off of each of their beers. It is unfinished now, but I wanted to get your thoughts. I know that the beer glass is a litte rough around the edges. This is the first real illustration I have started. Source for inspiration: <a href="http://www.lokeshdhakar.com/2007/08/20/an-illustrated-coffee-guide/">Coffee Drinks Illustrated</a>, by Lokesh Dhakar

I had this idea the other day to make some posters of what is in beer. The finished goal would be to have single beer poster and one large poster with all the beers. I would like to approach a craft brewery such as DogFish with this idea and base the content of the beer off of each of their beers.

It is unfinished now, but I wanted to get your thoughts. I know that the beer glass is a litte rough around the edges. This is the first real illustration I have started.

Source for inspiration: Coffee Drinks Illustrated, by Lokesh Dhakar

11 View ▸
See More Posts