Scratch – Good Food Good Music

May 14th, 2009 in Art & Design, Personal, Project, Work | 0 Comments | Leave a response

I’ve just completed preliminary concepts for a website I’m working on. Here are some screenshots of the mockups. The images are not final and some even contain iStockphoto watermarks, but I thought I’d show them anyways.

The site will act as an informational portal for the restaurant as well as a culture blog for music and all things hip.

blog_900px

menu

gallery

gallery_lightbox

contact

Comments (15 Responses)

  1. Marko says:
    May 14, 2009 at 12:22

    Looks great man, I can’t wait to click on things. The only thing I’m not too sure about is the radial gradient in the background. The edges it leaves can be a little distracting.

  2. admin says:
    May 14, 2009 at 12:49

    Thanks man. In regards to the gradient, the screenshots are cropped on the sides and so the gradient seems to stop abruptly. Once programmed in HTML there will be no visible edges.

  3. Marko says:
    May 14, 2009 at 15:07

    I meant like the quality of the gradient itself. I don’t think the transition is smooth enough, it almost looks like concentric circles when you use a radial gradient. Hey, why don’t you have an RSS Feed link anywhere?

  4. admin says:
    May 14, 2009 at 16:05

    Those concentric circles you are talking about are called banding. They are fairly common when the gradients are very subltle.

    However in this case they are accentuated because the screenshots were reduced in size by 50% and are not the actual size. Also the very subtle gradient banding will be visible mostly on lower quality monitors that are not capable of displaying all those shades. I will eventually post the actual size and you will notice that the banding in the gradients will not be as visible.

    In regards to the RSS, we are considering that for later states of the project. Currently the main concern is to show people the culture of the club its venue and the food.

  5. Marko says:
    May 14, 2009 at 19:12

    Yea, banding is no good. I get it in photoshop at full size even before I save the file as whatever format i need. I’m sure that your design will look good in full size though.

    Haha, I meant the RSS feed on your site. I was looking for it at the bottom of the page, but I see now that it’s on the side.

  6. admin says:
    May 15, 2009 at 00:40

    The way to get rid of banding on subtle gradients is noise. Add a layer with 10% noise and set it to multiply and give it an opacity of 40%.

    These are not exact values but it should give you the idea. In short, add a bit of noise over top of the gradient with banding and you will remove the bands.

  7. Blaine Zap says:
    May 15, 2009 at 13:25

    looks great Neil! Any room for a stella or Hoegaarden logo??

  8. ryan baldwin says:
    May 15, 2009 at 13:47

    Looks great Igor – kudos! I’m looking forward to both the site and the restaurant to be online. Good luck to Neil and all involved.

    - ryan.

  9. admin says:
    May 15, 2009 at 14:17

    Thanks guys, I’m too am excited to launch the site and get Neil to start writing the culture blog.

  10. NateDanLats says:
    May 15, 2009 at 14:22

    It looks great! really cool page…by the way what the hell is a radial gradient haha your awesome Igor.

  11. Slava says:
    May 15, 2009 at 14:23

    I can’t wait to see this baby online.

  12. jasia says:
    May 16, 2009 at 08:32

    did u take this idea from me?
    this is kind of like what i said i wanted for my site!

  13. Luka b says:
    May 16, 2009 at 09:28

    I’m the wizz !!

  14. admin says:
    May 16, 2009 at 14:07

    Jasia, if you are talking about the time you asked me to make you a really cool website, then yes – I made a really cool website. :)

  15. mandystarr says:
    May 19, 2009 at 12:12

    I think it is f_cking rad!!!
    the colors & text that you have choosen…. PERFECT!

Leave a Reply