Website Graphic Design

Some of what I do day-to-day can be a little dull, I enjoy it of course, but it doesn't make for the best reading, in posts like this. But over the past year I've designed and developed some pretty interesting websites, for some very interesting businesses. Some involved some Website Graphic Design, the most fun part of this job. So, I thought I would collate some of the best examples together in this post.

I do the vast majority of this type of work in Adobe Photoshop, although I do use Illustrator sometimes, logo design for example. It's a lifetime of learning, working with Photoshop. It's highly enjoyable, and I would advise any business owner to give it a try, or go on a course, even if it's just to design some of your own promotional material.
share this post...
Share on facebook
Share on twitter
Share on linkedin
Share on whatsapp
Share on email

We use SiteGround for all our Web Hosting, we think you should to. Check them out...

We use SiteGround for all our Web Hosting

We think you should to. Check them out...

The Cosy Bar - Local Pub Website

At the start of each contract I look at the diary and pencil in an approximate amount of time that the work will take, and a provisional date for going live with the site. A website for a local pub would only take two or three weeks, ordinarily, but for The Cosy Bar, in my local town, I wanted to do something a little extra. So I added a week to the schedule, and we added some Website Graphic Design elements.

Photoshop Neon Sign

One of the pages we created is to advertise the pub as a party venue, and we wanted to make a splash. Type “photoshop neon sign” into YouTube, you’ll find videos teaching you how to do this, so I won’t go through it step by step, but in short…

  • First, download a large image of a brick wall, or any wall. For stock images I use Envato Elements, they have thousands of high quality design elements, including stock photography for a small monthly fee. But I’m sure you’d find a brick wall image on a free image website. Apply a vignette, so that the centre of the image is much brighter than the edges. 
  • Find a font that looks most like a neon sign. You will find some already installed with Photoshop, but again, Envato Elements is great for this. Something modern, with not a lot of embellishment, and then reduce the letter spacing so that they connect to each other.
  •  Draw the cocktail glass in a slightly larger line width to the text.
  • Then it’s a combination of colours and layer styles. Check out YouTube for the exact steps. Give it a go yourself, it’s a lot of fun.

Painting on Board Effect

A relatively simple process, for an eye catching effect. That’s why Website Graphic Design is so important to me, it adds that little bit of sparkle, and uniqueness. 

A variety of Photoshop techniques used here. We start with an image of a wooden board. On top of this we overlay an image of the pub, and the logo. We then mask the darkest areas of the board and delete the image from those areas, and reduce the opacity of the pub image until it looks like it was painted on the board.

Retro Pub Signs

These signs were created in a very similar way to the wooden board effect above, but this time we started with a blank, rusty metal sign. For Sky Sports the steps were almost the same, but with a higher image opacity, and a few areas erased, like the paint had rubbed off the sign in places.

The Guinness Sign was created in exactly the same way as the painting on board effect, but the texture of the metal sign left the image less visible. I was very pleased with how both of these turned out.

The Diablos Vape Club Website

Diablos Vape Club, based in Essex, UK, was one of my personal highlights from 2020. It was the largest website I built last year, but that doesn’t mean there were o Website Graphic Design elements.

This is a still shot of the homepage. When you land there the screen is mostly black, but after a second or two a puff of smoke rises from below and reveals the logo. This is achieved with stock footage as a background and the blending mode of the logo.

Website Graphic Design - Personal Touches

Website Graphic Design - Contact Section

This 3rd example is way more subtle than the other, but no less effective. I am currently working on a website for Bliss Beauty, Health & Nutrition in Castlerea, Co. Roscommon. We started work together towards the end of last year, and the work continues. This site will go live next month, all going well. This small element is a classic piece of buyer psychology. Next to every instance of the website’s contact form and opening hours we have an image of the owner, and her signature.

The image was created by masking the background, then adding a gradient layer, from white at the bottom to transparent at the top. The signature was scanned into a Photoshop document, and again the background was removed by selecting the ink areas and filling with dark grey, deleting the rest.  

Website Graphic Design

I don’t normally describe myself as a graphic designer, and I don’t really think of myself as one. But a while back I found out that not all web designers/developers do the type of work we have looked at in this post, I call it Website Graphic Design. The client, in many cases would have to employ another person, or agency to create images, logos etc. I’m very happy about this to be honest, because it’s these aspects of the job that I enjoy the most, and it gives me an advantage over the competition.

See you next time on the FutureProof Digital Blog.

Hi, I’m Adam, thank you for being here at FutureProof Digital. We publish regular content including blog posts, guides, reviews and updates on our latest projects. To stay up to date with everything we publish, sign-up for the newsletter.

Adam @ FutureProof Digital

What can FutureProof Digital do for your business ?

If you’re a small business owner, then you know that having a website is essential in today’s world. Not only does it give your customers another way to find out about your business, but it also allows you to reach a larger audience than you would be able to if you were only relying on word-of-mouth advertising. However, just because everyone has a website these days doesn’t mean that yours will be successful. It takes careful planning and execution to create a small business website that will help grow your company.

At FutureProof Digital, we understand the importance of small business websites. That’s why we specialize in creating websites that are not only visually appealing and user-friendly, but also optimized for search engines so that you can get the most out of your investment. We believe that a great website doesn’t have to be expensive, and we’re proud to offer some of the best prices in the industry. If you’re ready to take your business to the next level, contact us today to learn more about our small business website design services. We’ll work with you to create a website that is perfect for your company and will help you reach your goals.

Is it web design, or other related services you are looking for?

At FutureProof Digital we specialise is small business and start-up websites. Get in touch for a free, no obligation quote. Click here to view previous projects…