Tag Archives: design

Working On A Site Redesign.

One of the things I love about working on personal projects is the freedom you get in your design. You can experiment a bit, play around with the code, test out different layouts. For the most part, there really isn’t any pressure to produce something extraordinary on the first attempt. On top of that, you can just keep hacking away till you come out with the perfect design and layout. Add something, take it away, add it back, then completely switch it up if you’d like.

You really can’t do that with client projects. For the most part, you get a feel for what the client expects, code out a couple different versions in a set period of time, and hope and pray the client is happy with one of the end results. If you’re reading your clients correctly and listening to what they want, this usually isn’t a problem.  They pick a design, you get it uploaded to the server, do a little beta testing looking for any bugs or glitches, and if all goes well, you move on to the next project.  Easy peazy!

I’m currently in the middle of a client project that is going well. In the meantime, I’m also redesigning bitcoindood.com and this site. I’ve learned so much in the first thirty days of doing the 100DaysOfCode challenge on Twitter, that I think I’m just going to hack away at my two personal projects and see what I come up with.

It’s been a long time since I just built something with no direction. In my opinion, those were always the funnest projects and gave birth to some of the best results. I’ve got a pretty good handle on the client project I’m working on. Over the next several weeks, I’ll be practicing all the new markup and css I’ve learned on my personal projects. My personal sites will probably be changing on a daily basis. I’m pretty excited to see what I come up with.

In other news I’ve signed up for a free eDX JavaScript course that I’ll be starting next week. Staying busy, keeping it fresh, and updating my skill set!

 

Working On My Use Of Fonts In Photography and Graphics

I’ve been updating my understanding of modern HTML5 and CSS3. One of my weaknesses has always been graphic design. It was one of the things that stopped me from wanting to start a freelance web design business. Seeing I’m on a self improvement kick, I figured it was time to update some of those design skills as well.

One of the things I’ve wanted to work at for a while now, is how I utilize fonts in graphics and photography. I’ll be sharing a bunch of my work on Twitter and other social media sites. I spent the afternoon playing around with some font work. I’ve got a long way to go but I did like the way this one turned out.

I’m not going to do a full out tutorial on this, although I will be posting tutorials again soon. I did want to share this though, and just briefly explain how I created it.

photo and c;loud quote

Keep your head in the clouds and your feet on the ground.

This was a simple edit I did, taken from a blurry image I took at the boat races. I cropped out a section of the image because I loved the way the clouds looked. Then using Gimp I went to Filters/Map/Make Seamless. That gave me the layered cloud effect and it can also be used as a website background or graphic filler without the text now.

Here’s the image I took the clouds from. Terrible composition and blurry.

blurry image of boat races.

I cut out the clouds from the upper right hand corner. Added some text with an inspirational quote.

The font I used is called CAC Champagne. The text was written out in sky blue lettering. I created a second transparent layer then created an alpha selection with the lettering. I grew the alpha selection by 2 pixels, then used a black flood fill on the transparent layer. I then removed the alpha selection and used a gaussian blur on the blue lettering.

I really like the way the font effect came out. I’m planning on doing a bunch of these inspirational style quotes as a way to improve my font work. I’ll post my progress to the blog regularly. I’m not the greatest at Gimp, but I’m really happy with the progress I’ve made with the program. The important thing is that my clients seem happy with the work.

Here’s another image I posted to my Twitter earlier.

inspirational quote and photo of bird

Your attitude, not your aptitude, will determine your altitude.

One of the most important things I’m learning is how a font can set the tone or feeling of the project you’re working on. Whether it’s photography, graphic work, or web design, the font selected helps set the tone of your content. I experiment with colors, tones and fonts till the project has the right feel to me.

What you do when you overwrite a website with an older version.

So last night I’m up working on stuff till about 6 a.m. Around 4 in the morning I decide I’m going to tweak my Tumblr blog real quick. I have a special blog on there that I use as a test lab. I make configurations, add stuff, tweak and when every thing looks A O.K. I copy and paste the code into my other blogs that are using the same theme.

So I tweak the theme a bit, I’m happy, I copy the code and paste it into my other blogs not realizing that there were unsaved changes from a previous edit. This was a couple hours work at least, and in a moment of acute stupidity that only took a couple seconds to perpetrate , I overwrote all the changes I had made at an earlier date. To add insult to injury, I couldn’t even find the graphics I had used in my backup. My heart sunk, I was tired, feeling really stupid, and couldn’t believe what I had just done.

Frantically I scoured through the directories on my hard drive, in hopes that I could find the backup files to no avail. In a state of panic I calmed myself and said out loud to no one in particular “o.k. stupid think !” Then it dawned on me, in my moment of desperation I recalled someone talking about a program called time machine or something like that, that stores cached copies of websites on there servers. You just type in the url of the site you want to see, and it pulls up its last cached version of the website. I did a search engine search and low and behold discovered http://www.cachedpages.com/.

I quickly typed in my url and clicked on the Google cache button. To my amazement there was my old site,exactly as I had designed it before my momentary lapse in judgement. The graphics, the new search box, the links, the Twitter widget, the hours of work I had done on the sidebar were all there ! I right clicked on the header image and saved to where I thought the back up file was. I then right clicked on the page again and clicked “view page source” and copied all the code I had overwrote. At last, my world made sense again ! There truly is a God and I gave thanks ! Cachedpages.com saved my REAR and if this ever happens to you, try this because it worked great for me.

Once I got my code and graphics the problems were fixed in under 10 minutes. Words can’t describe how relieved I was. The moral of this story is to always keep backups. I usually do and if this had been a clients page I’m sure I would of known exactly where they were. I tend to be more careful with other peoples stuff, than my own. Plus my Tumblr blogs are just a hobby and somewhere to play when I’m relaxing. I usually keep backups of my backups which go back two changes. So I have the original on the server, a copy on my hard drive, and a copy of the old copy named sitename.bak before changes were made. Using this system, if something goes wrong, 99.9 % of the time it’s completely recoverable.

With that said keep backups, but if the worst should happen check out cachedpages.com or a similar site as a last resort. It really saved my ass !

Making Time For Design

Things have been real busy. Sitting around drinking some wine and playing around with Gimp I realized that no matter how busy things get you have to make time for yourself. Even if you just put an evening aside to do the type of design work you enjoy doing while sipping a half way decent bottle of wine. Playing around with fractals in Gimp, or creating a silly graphic to share on your favorite social networking site.
socail_notworking