My Vouliagmeni » Logo

Global Sports US Logo Reviewed

Yorgo Nestoridis — Thu, 06 Oct 2011 10:33:03 +0000

Original Article at Global Sports US Logo Reviewed.

Global Sports US Logo

For the purpose of creating an animated version of the Global Sports US logo, it was necessary to partially redesign it and to vectorize it. The next step was then to take it to Adobe Premier Pro to animate it. Listen Up Londow, who are doing video clips for Global, requested a simple rotation every 20 seconds.

Incoming search terms:

How to create a Favicon with Photoshop

Yorgo Nestoridis — Wed, 09 Mar 2011 12:40:12 +0000

Create .ICO Files (Favicons) with Photoshop

The favicon or icon is part of the customization of a website. The favicons show namely in the browser tabs. Nowadays most browsers will also show .gif and .png icons; the .ico format is preferred by Internet Explorer.

A quick and easy way to create a Favicon is by using the online tool put at disposal by favicon.com. A better result can be achieved by editing the favicon in Photoshop; however Photoshop does not support the .ICO format in its native version. A plug-in can remedy.

Download and install the Plug-in

To start with, download the free Plug-in from Telegraphics.

Paste the plug-in file (ICOFormat.8bi, or ICOFormat64.8bi for the 64 bit version) in your Photoshop: …Program Files/Adobe/Photoshop/Plug-ins/File Formats.

re-start Photoshop.

Parameters you must respect

The .ico file format will only be available in Photoshop if you respect the following:

Maximum file size 256 x 256 pixels
RGB, Bitmap, gray-scale or Indexed mode
Maximum 8 bits per channel

To save an image as .ico, use “save as” and select from the drop-down the ICO format.

How to Create an Icon or Favicon in Photoshop

Favicons are small icons, very small icons, since they measure only 16 x 16 pixels. Designing an Icon is a challenge since its display should be meaningful. To work more comfortably with your photoshop, start your design with a larger square canvas, a multiple of 16 pixels, for example 64 pixels, 128px or 256 pixels.

For the purpose of this exercise I will use a 128 px x 128 px canvas with the following presets:

You may save these settings as Preset for further use.

Best results are achieved if you keep your design simple and rich in contrast.

1. Open a new file with the above presets:

2. Fill with your background color (or pattern)

3. Add content

Best result with vector graphics, custom shapes, good fonts and such likes; just create a new layer and add …

4. Resize

Resize to 16px x 16px and resample selecting ‘Bicubic Sharper’:

We get now:

5. Save as .ICO

Now “Save as” (don’t use “Save for Web and Devices”) and select the ICO format. Rename the image to favicon.ico:

6. Embed your new Favicon

Most browsers will find your favicon.ico automatically if you just load it into your website’s root folder (where the index.html is located), others are looking for a direct link to the favicon. To help these last browsers just add the following lines to your header (between the … tags):

Load your favicon to the root folder of your domain and make sure it’s called ‘favicon.ico’.

That’s it.

Semiomantics Shop for WordPress

Yorgo Nestoridis — Tue, 08 Mar 2011 18:26:14 +0000

Customization : Icons and Graphics

Theme and skin specific graphics are contained in the two respective image folders, one in the theme root and the other in the skins folder.

The Home Icon

The Home icon, visible in the first tab of the navigation bar is of particular interest as the image can be customized for branding purposes. Apple puts its logo there …

The image is called ‘home.png’ and measures 21 x 34 pixels containing two home icons of different coloration to achieve the hover effect. You may download a free PSD file containing the original image and some variations; click on the image below.

Customize the Home Icon

To change the design all together,just create anew image in Photoshop.

Use a 21 x 34 pixels transparent background
Place your Logo into the top half
Duplicate the logo layer and position it in the lower half.
Select the lower icon and tint it darker (for the hover effect).
Save as transparent .png and replace home.png in your skin image folder

Other Sample: Semiomantics eShop Theme for WordPress

This ismage measures 30 x 60 pixels and requires and adjustment of the menu script, namely of the superfish.css file. Lines 29 and 30 read now:

 .sf-menu li.home a { background:url(../../skins/0-yorgoo/home.png) no-repeat; width:30px; height:30px; padding:0; margin:8px 10px 0 20px; text-indent:-9009px; overflow:hidden; }
.sf-menu li.home a:hover { background:url(../../skins/0-yorgoo/home.png) no-repeat 0 -30px;  }

These lines define the image size as well as the positioning of the image in the navigation bar.

Check-in at tonight’s call when we will work on individual customization.

Logo Design with Photoshop

Yorgo Nestoridis — Mon, 31 Jan 2011 09:44:02 +0000

How to design a simple Logo with Photoshop

After a rich Seminar, let’s relax with a simple Logo design at tonight’s call. The exercise will consist in using custom shapes, fonts and styles from Photoshop according to the below samples:

Semiomantics Logo

A colored version:

Semiomantics Logo in Helvetica

A neutral version in Helvetica:

Semiomantics Logo Impact Arial

Version using free fonts:

To prepare the session, please download the image and Photoshop file; we will use them as a base and then move on to profit from your creativity:-).

I am looking forward to seeing you tonight at the call.

Build your Flash Website Step 2

Yorgo Nestoridis — Tue, 23 Mar 2010 08:21:44 +0000

[ hide ]

1 Build your Flash Website Step 2
1.1 The Menu – the Site Structure
1.2 Basic Customization – Branding and Look

Build your Flash Website Step 2

After yesterday’s definition of the project, we will move a step further today and implement basic customization. This series of posts is designed for participants of the upcoming Ycademy Seminar with the topic “Build your Flash Website”.

The Menu – the Site Structure

I have set up the menu and defined the structure on the new Semiomantics Evolution Framework:

Semiomantics Evolution Menu

As you can see, there is some customization needed to fit my branding needs.

Basic Customization – Branding and Look

For the purpose of this demo, I will behave as would a newbie or a new customer who wants to set up an online presence with Semiomantics Evolution.

1. Define your brand: yorgo design

2. Get a domain: I just registered yorgodesign.com at yorgodom for $12.95 per year with lots of goodies included.

You don’t need a new domain; the Evolution site can be loaded to any existing domain and into any folder.

3. Get a web host: I just got unlimited hosting from ChiHosters for $35 per year.

You don’t need a new hosting account – see under 2 above.

4. I got my site script from Semiomantics (you will get it at the Seminar – it’s included in the ticket price as all the other materials you will need to build your site).

You do need a seminar ticket to get the site script and Semiomantics add-ons. I will load the script to the host.

5. I create my header and logo for the site: the header is no problem, the logo needs some thinking and testing. The header label will bear the logo and the name of the new flash website:

pslogo

Header Label

As you can see, there is a stack of 4 layers. For the site I will just use the transparent text layer and write in white using the font defined for my new brand “yorgo design”.

Label Size: 325 px x 75 px

Font: Caviar Dream.

Download my Header PSD and Font

You may create your label using my PSD; you may modify the width, however it is not recommended to increase the height. Change width from ‘Image – Canvas size’ in Photoshop.

Join tonight’s Ycademy call at 7 pm London time where we will create header labels step by step. If you don’t have Photoshop, we will do the label for you tonight at the session.

Footer: I will edit the footer to adapt it to my needs, Copyright notice, site name and eventual other notes.

See you when all the above is done – look out for step 3.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics.

If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

This page is wiki editable click here to edit this page.

Create your animated 3DLogo tonight

Yorgo Nestoridis — Fri, 12 Mar 2010 13:50:58 +0000

[ hide ]

1 Create Your animated 3D Logo Tonight

Create Your animated 3D Logo Tonight

Let’s have some fun tonight at our relaxed Friday session: create your 3D Logo and make it spin!

For tonight’s participants we have a great logo creator in store which you may want to try out … and keep for future use.

bianca

Bianca Logo

or click on the below to see the animation:

bianca

Bianca 3D Logo

The Download link will be disabled in 3 hours from now!

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics.

If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

This page is wiki editable click here to edit this page.

Create your 3D Logo

Yorgo Nestoridis — Thu, 11 Mar 2010 14:52:45 +0000

[ hide ]

1 Create your 3D Logo

Create your 3D Logo

Ever wanted to create your own 3D logo? And get one of these Hollywood looks or glow like on Broadway?

Well, it’s possible!

yorgo1

Yorgo Logo

A bit of color, a nice font, a bit of bevel, some light and a shadow and you are in the race. Of course you can choose some more fun colors and textures or even neon light, your imagination is the limit.

Once you have finished your basic design, add some animation to give it this touch of the rotating Big Mac on next corner’s Junk Food kiosk. An axe to rotate around, a .GIF format, a background to drop the shadow on, yeahhh you may even add some music and you are ready to rotate on top of the Empire State Building … or as the case may be on the Eiffel Tower.

yorgo2

Yorgo 3D Logo

As these images may stress my transparent image handler on this site, I have loaded the two images to a separate page HERE.

PS: If you are interested in learning how to create your logo in animated 3D format, just register for the March 2010 Ycademy Seminar and build the most smashing site you have ever owned!

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics.

If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

This page is wiki editable click here to edit this page.

Logo Design Study for Zo Nicholas

Yorgo Nestoridis — Thu, 04 Mar 2010 03:33:46 +0000

[ hide ]

1 Logo Design Study for Zo Nicholas

Logo Design Study for Zo Nicholas

Here below some images from a first logo design session with Zo Nicholas; the purpose is to create a logo which can be applied online as well as on printed matters. The following images represent the first 20 output shots. More to come.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics.

If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

This page is wiki editable click here to edit this page.

My Vouliagmeni » Logo

Global Sports US Logo Reviewed

Global Sports US Logo

Incoming search terms:

How to create a Favicon with Photoshop

Create .ICO Files (Favicons) with Photoshop

Download and install the Plug-in

Parameters you must respect

How to Create an Icon or Favicon in Photoshop

Semiomantics Shop for WordPress

Customization : Icons and Graphics

The Home Icon

Customize the Home Icon

Other Sample: Semiomantics eShop Theme for WordPress

Logo Design with Photoshop

How to design a simple Logo with Photoshop

Semiomantics Logo

Semiomantics Logo in Helvetica

Semiomantics Logo Impact Arial

Build your Flash Website Step 2

Contents

Build your Flash Website Step 2

The Menu – the Site Structure

Basic Customization – Branding and Look

Create your animated 3DLogo tonight

Contents

Create Your animated 3D Logo Tonight

The Download link will be disabled in 3 hours from now!

Create your 3D Logo

Contents

Create your 3D Logo

Logo Design Study for Zo Nicholas

Contents

Logo Design Study for Zo Nicholas