This is part 2 of this series. You can view Part 1 here.

I decided to split the main screen in 2 sections, after the “slideshow” on the billboard. One section will cover copy about myself, talents, skills, etc. and the right sidebar will include “Services” and “Design by Satori featured in”.

The sidebar will change according to whatever page I’m on and display information with links for easy navigation. For example, if on “Portfolio” page, the sidebar will include:

• Web Portfolio – with copy and my best samples
• Before & After Design Portfolio – section with jobs I took over and redesigned sites for clients
• Logo & Branding Portfolio – samples of my work along with copy of logo and branding
• Brochures Portfolio
• Print Portfolio
• Graphics Portfolio

For the “Portfolio” page I am currently using thumbnails but after reading some more on Smashing Magazine, I reached the conclusion that thumbnails should be eliminated and large pictures of the design work should be displayed without leaving people guess what every thumbnail would be.

An explanation of each project will be a nice add-on (and that will give me some more tags and keywords that would please the All Mighty Google). Of course “Calls to Action” with “Contact” information would be present next to each project, allowing the web viewer to immediately take action once convinced the work is up to his/her standards.

In conclusion – the below shows where the change will occur:

Existing Design

Proposed Design

Another area that I think needs to exapand is the “Resources” section due to my belief that people will see you as an expert if you are giving away free resources and hopefully come back for more. More come back visits, translates into higher traffic and higher traffic means more exposure in seach engines and thus more clients.

Speaking of displaying my best work, on the existing site, on the “Portfolio” page, I am using a piece of javascript code called Lightbox. It is an awesome code that allows you to view pictures and chuncks of text on a very cool pop-up window, while the background goes dark. It is customizable and I highly recommend it.

This can be seen in action here and a screenshot below:

The new site will also include many links to my blog – Defactomind.com that should help also Google page ranks. This concludes Part 2 of this series. Click here to go to Part 3 and final of the “Web Redesign”

It’s been almost a year since my last redesign of “Design by Satori” and it’s time for another one. By the way -I highly recommend redesigning your site once per year or at least updating chuncks of text in your web copy at least 4 times per year. This will maintain Google rankings not to mention the nice surprise you will give your web viewers – showing that you care about your site and the way you present it to them.

I have decided to share with you the pain of redesigning a website, especially if you are like me (looking at tons of websites for inspiration, trying something, don’t like it and start all over again).

Well the present site was a bit too dark. Here’s a shot of it here:

In fact, here are all my versions since I decided to redesign the site every year (sometimes twice):

Version 1

Version 2

Version 3

The structure of the present site is sound and does not contain a bit of tables. Well…almost. I used 2 tables when I encased the “Contact” forms, casue I was too lazy to figure it all out. The rest of the site is all developed in CSS. In fact these are the “weapons of choice”:

• CSS – using Notepad as editor
• FrontPage – also used as editor (I know it’s old and few use it but I’m so used to it, I just can’t get rid of it…)
• Dreamweaver – here and there (mostly there…)
• Photoshop CS4 – there are no words to describe this great piece of software; after 7 years of using it I still feel I barely scratched the surface of its capabilities.
• My trusted Canon EOS Rebel XSi – to take great photographs
• Photomatix – a piece of software I just bought and played in HDR a couple of times – I like it so far

What don’t I like about the site? Not very many things but the overall comments were: “It feels like a socialist propaganda website…the red stars next to your menu items do not help either” or “It’s nice but too dark. If this site represents you…well, then you must be trubled…”

Based on this I started the work and here’s what I came up as a battle plan:

1. Copy – I will use the same text, but replace large chunks of it and make it more as a freelance site as oposed to a design agency site. The “Main Page” needs to be re-writen and make it a bit more whimsical and not so corporate. The more I was reading the text the more I felt like another corporate drone3 and wondered how I even conceived that dry copy.

I re-wrote the entire “Main Page” and dipped into my “writer ego” with new copy. Once I finish the site, of course you’ll see it and understand what am I talking about here.

2. Structure – I will maintain the structure and change only the main page, creating more “Calls to Action” and emphasize on the ‘Portfolio” page. I will also use the 960 grid for websites, which I like and I think it makes sense, accomodating all browser rezolutions starting with 1027 x 768. For those who have less than that – sorry, that’s where the web rezolutions are for more than 87% of the web surfers so I”ll have to cater to them.

I also needed more links for possible clients to contact me via my social edia accounts (Twitter, Facebook, Linkedin, Flickr, etc.). OVerall – I really need to up the number of links from this main page to all the others (within the site), plus to this blog and hope to climb in Google page ranks.

3. Design – I wanted something cleaner, less dark but artsy enough that my designer skills still can shine through. I decided on a white background with eerie clouds like here:

I also decided to repeat the theme (of dark blue clouds) in the “footer” to grab attention. The header will contain a menu with simply <ul> items instead of sprites coded in CSS to display “cool” but unnecessary graphics. So – text links – best for search engines.

I love smart billboards so I decided to include one above the fold with changing images very 3 seconds (enough for viewers to see it, allow just enough time to think and move on to the next one). I am still having some problems showing PNG transparency in IE but I have some ideas how to circumvent it. Of course Firefox displays it correctly, but I have no time to whine about the IE shortcomings.

For font I decided on ‘Arial” throughout the site. I think it looks cool (especially in headers) and people are used to it.

4. Development – Of course I will stick with CSS (nothing beats that) and hopefully I will learn a thing or two about using it in forms. I still use some CGI scripts with my forms and getting rid of an old and used thing it’s a bit hard, espcially when I have so many balls in the air.

So that’s the plan. I have no time limit on this project. I work on it whenever I have time, between the blog, clients, web promotion, reading marketing and design books and working on a joint venture with another gentleman for a brand new game.

In part 2 of these series I will delve more into the design and development part, so stay tuned.

This was published on Smashing Magazine by Cameron Chapman

Designers spend hours perfecting websites, whether their own or their clients’. When you’ve invested anywhere from a few days to months in a website, the last thing you want is for someone else to steal the design without even giving you proper credit (or compensation). And if you’re a template or theme designer, it’s an even bigger problem. After all, if your templates are available online for free, a lot of people won’t bother paying for them.

So what can you do if you’ve discovered that one of your designs has been ripped off? What should you do? Read on for a complete guide to steps you can take to protect your intellectual property.

I am not a lawyer, nor do I pretend to be one on TV, so the advice here should not be taken as legal advice. Before taking any of the actions mentioned below, check with a lawyer or other legal expert to see what is allowable in your state or country or to see if additional options are available to you.

Read the entire article here

Another blog project on Defacto Mind; there are only 18 days left until New Year and I decided to schedule 2 more activities and write about in the Defacto Mind blog.

For the next 3 weeks I will write a book review every Tuesday and I’ll call it “Cool Blue Tuesday Book Review”. There is really no reason why Tuesdays would be blue or cool for that matter but I just thought it sounds catchy. So, every Tuesday, after reading a book about SEO, marketing, design or social media, I’ll share with you my impressions about a particular book and recommend it (or not) to you – the reader.

On the same token, every Thursday will be reserved for a small summary of a blog with information covering the same items mentioned above. I will call this “Thursday Blog Talk”.

At this point, I don’t know which blog or book I will review so I guess it will be a surprise for everyone. If all works well, I might continue this practice throughout 2010.

In the same time, I’ll continue with “Creative Friday” with articles about design resources for everyone who wants to improve their skills and craft.
In summary, my blogging schedule for the next 18 days will as follows:

Tuesday – Cool Blue Tuesday Book Review – December 15th, 22nd and 29th
Thursday – Blog Talk Thursday – December 17th, 24th and 31st
Friday – Creative Friday – December 18th and 25th

…and the madness continues…

Wandering about in Barnes & Noble the other day, I discovered a little gem called “Before & After: How to Design Cool Stuff” written by John McWade. As an avid reader of design books and articles I was pleasantly surprised to find out the basic and not so basic elements not only of good but excellent design.

Although I design for over 10 years now, the information I found in this book was an eye opener; and I thought I knew how to design stuff. Needles to say – after reading and studying it, now I can design cool stuff. This book should be on the desk of every designer who respects his craft.  

The real life projects presented are easy to follow, the “before & after” offers a wonderful way of observing a project from start to finish and above all John McWade takes you to a grand journey into the world of design. He presents key elements of designing brochures, logos, ads, DVD covers, websites, newsletters and even presentations.

Compared to other books, the “Before & After: How to Design Cool Stuff”, has no design fluff or unnecessary explanations. It’s straight to the point, bare bones solid design information makes it a great read.  It’s very clear to me that the author wrote it with the designer in mind, offering detailed and technical advice on concrete examples.

What you’ll learn from the book:

• How to “manipulate” the viewer’s eye to concentrate on specific areas of the design
• Basic techniques of line, motion and color
• How to select the right typography for your design
• How to visually communicate with art

These are just a few but what makes this book fantastic is the simple explanation of why a design works in one way and not another, offering the blueprint for cool.

by Gareth Hardy, Published in Smashing Magazine

Created by Transformer Studio

With the power of the Web, and more eyes watching than ever, it’s important for a business to communicate its unique message clearly. The easiest way to recognize a company and distinguish it from others is by its logo. Below, we go through 10 common logo design mistakes that you should avoid if you want to create a successful and professional logo.

Read the entire article here…

You can also check out this great article about “What Should You Get from Your Logo Designer” : http://www.thedesigncubicle.com/2009/01/what-should-you-get-from-your-logo-designer/