Sunday, 21 October 2007

Editing classic blogger templates continued



Here is the screenshot of my progress so far, i plan to add a three column layout to the footer and tweak the fonts etc. I will post the css and images once finished.

Saturday, 20 October 2007

editing classic blogger templates

I have continued my editing of the classic blogger template "rounders two" and have made a fair bit of progress. Althrough this template is not ready to go live quite yet i was going to post a screenshot showing my progress, but... there seems to be a problem with bloggers image upload script.

Friday, 19 October 2007

HTML,CSS plus a tiny little bit of PHP



HTML AND CSS WEB DESIGN my latest project is going to be the redesign and relaunch of the first website i created almost two years ago.
I've learnt a little in the last two years and this redesign will be standards compliant html and css. O.K so validation is only half the battle, it is of course true that while a page may validate correctly does not necessarily mean it will be cross browser/platform compliant. So whats a boy to do? Banging your head on your desk may seem like a good idea at the time(it won't help). Thats not everything i've learnt so far, get the latest versions of the popular browsers on your machine(IE,FireFox,Netscape and so on)for testing then visit browsershots here you can test your url in thirteen different browsers across all platforms specifying the screen size(from 640px -1600px)and other elements like javascript, flash and java.




One of the requirements of the redesign is for the client to be able to edit the content of the site without the need for any technical skills or software. So i have created a php script that outputs to text files which are included within the pages html with php. The sites admin pages where the content is edited uses the tinymce javascript text editor.



Once i finish this project i would like to develop this script in to a full content management system that allows the user to also edit the navigation and other elements much the same as blogger does.

Shopping, Beans & software upgrades




I hate the weekly shopping trip as much as the next man, the bright fluorescent supermarket lights and long queues are almost always certain to send me into a zombie like state in no time. I just about managed to stay half wake tonight as i thought about trying to emulate some food package labels with fireworks. I had recently downloaded some western style fonts from 1001
free fonts and had been eager to try them out, so i chose a well known brand of baked beans that i had remembered used a western style label on it's cans.
Thirty or forty minutes after my return from the supermarket and i had created the above png, although it is not identical to the food can i am happy that i was able to create a similarly styled object relatively easily.

I'm very keen to try out the latest incarnation of fireworks(cs3). I have always been very sceptical about software upgrades it only seems like yesterday that i starting using fw8 and wonder does the latest version have enough upgrades and new features to justify the price tag.

Wednesday, 3 October 2007

WEB 2.0 LOGO REFLECTION


Easliy create a logo or image reflection in fireworks
once you have created your icon/logo/image and grouped its elements together (CTRL+G).
Select duplicate from the edit dropdown (CTRL+ALT+D). This automatically places a duplicate of your orginial object on to your canvas.
Ensure you have your duplicate image selected then from the main menu choose modify > transform >flip vertical as shown below.

Now you have a mirror image of you original icon
lets reduce the master opacity of the duplicated icon to further enhance the reflection effect. The control for this is located in the right hand side of the properties panel.
Once you have completed this step you may wish to reduce the height of the reflected image to suit yourself.

That's it, to keep your images editable don't forget to save a png copy.

3D text effect with fireworks mx



Grab the text tool from the tools panel and drag it out across your canvas then input your message or logo. This will form the 3D shadow so choose a dark colour and set the stroke colour to black (#000000)

With your shadow text already selected select edit > duplicate(CTRL+ALT+D)
This will reproduce your shadow text on top of your original text. With the duplicated text selected choose a light fill colour from the properties panel whilst leaving the stroke black(#000000).

Now simply position your duplicated text in place to create your 3D effect.Once you have chosen your preferred perspective group your logos highlight and shadow together(CTRL+G).

Have fun!

One step photo editing in fireworks

Heres a one step fix for editing under or over exposed photos using fireworks.
Open the file you wish to edit with fireworks
Select the image then open the properties panel if it's not already open(ctrl+F3).
From the properties panel select the add filters icon > adjust colour and then select the curves option.

Once you have the curves window open ensure the preview check box is ticked, this will allow you to see the effects being applied to your image. Now simply place your cursor on the line in the centre of the curves grid and drag it from left to right, up or down until you are happy with your image. Then click ok to close this window.

ctrl+s to save your file.


It's that easy, did you find this tutorial helpful? Or not?