November 16th, 2006
Dunno how many of you are cartoon fans but I have been watching a really fun series recently called OBAN Star Racers. The series is made by a French studio called Sav! The World Productions and in their words…
The result of six years of development and two and a half years of intensive production in Tokyo and Paris, Ōban Star-Racers sets itself apart from other series by the quality of its 2D/3D animation and its attention to detail – carefully crafted designs, rich characters and story – which are similar to those usually found only in feature films.
The show has been running on Jetix and I have had immense fun watching the omnibus on Sunday mornings. They have been showing the program every day at 5:30pm and then showing an entire weeks worth of the show on sundays which meant a full 2.5 hours of total OBAN immersion, unfortunately I missed the beginning but this has all changed now.
They are actually showing the series again from the beginning and there is an episode every morning at 8:30am which is the perfect run in to my day. Yes, I am a sucker for a good cartoon but this one has made me stand up and take notice, I think the only other one to really have that effect on me would have to be the Spiderman cartoon which I used to get up and watch on a Saturday morning no matter how drunk I got the night before lol…
Here is a quick summary of the story…
Every 10.000 years, the greatest pilots in the universe face-off in a mysterious and mythical race: the Great Race of Ōban. It is said the outcome of the competition will radically transform the balance of power within our Galaxy…
Sav! The World Productions
The series spans a total of 26 episodes and has a pretty good storyline, okay, the die hard anime fans would probably say it is panzy assed bullshit but I like it and would recommend it to anyone. There are a host of cool characters in the races, one of my favorites being Spirit who is a character that actually morphs into his star racer and has a bizarre face within a face…
A face within a face…
Morphed into a star racer
A close up shot of Spirit
The actual star racer ships are all quite cool as well, they basically get launched into each race track and then have to scan for the actual gateways they need to race through in order to win the race. Once they have found them it is no holds barred with each ship having all sorts of weaponry and several of the racers get upgraded throughout the series also.
There are tonnes of pics over at the Unofficial UK Ōban Star Racers site so I won’t post any more as this is beginning to eat into my morning but I just thought I would share my morning joy with everyone as this truly is a kick ass series!
WATCH IT!
November 15th, 2006
Good evening one and all, NotCot have done it again and come up with yet another inspirational toy only this time I can actually use it to deliver a message to you. Why don’t you have a read of it and I look forward to your reply…
My message to you all…
November 8th, 2006
Learn the principle, abide by the principle, and dissolve the principle. In short, enter a mold without being caged in it. Obey the principle without being bound by it. LEARN, MASTER AND ACHIEVE!!! - Bruce Lee
Like every good tradesman it is important that you master your craft and in web design it is equally important. In previous articles I have talked about being flexible whilst working and also some techniques you can employ to help you on your way but the most important thing is to learn your craft properly.
Like in every trade there are shortcuts that can be used and with time lines and project deadlines it isn’t always possible to go with the ideal solution. Quite often there is compromise involved in order to meet client demands but one thing that is important is to know the rules before you bend them…
Thinking outside of the box is one of the most fun things in the world but it has to take some grounding from somewhere first, there has to be a box to think outside of. How many sites do you see at the moment that are successful and use an almost carbon copy of the last design?
Take what you see somewhere, be influenced but do not copy, take your skills, master them and play with them, learn from successful sites and then innovate, break the mold and maybe you will be the next thing.
November 3rd, 2006
True refinement seeks simplicity. - Bruce Lee
Websites are a funny old thing, for some reason they make you want to add more to them all the time and I for one love doing it but where do you draw the line? When it comes to web design I think we can draw parallels to the economy of motion theory but in order to clarify what I mean let me quote something from Wikipdedia then take you through the various points.
A. Stop hits & stop kicks
This means intercepting an opponent’s attack with an attack of your own instead of a simple block. JKD practitioners believe that this is the most difficult defensive skill to develop. This strategy can be a feature of some traditional Chinese martial arts. - Wikipedia
One of the key elements in web development is understanding the problems that lie ahead, what with all the browser quirks and inconsistencies in CSS support between them it is important to know what might cause you problems. For example, a bad way to enter into a project would be with the gung ho approach, coding full tilt and adding CSS Hacks , non semantic containers and inline styles all over the place just to get the job done. Along that road lies trouble!
A sensible way of approaching coding a web page is to look at the information you are presenting and then mark it up using the relevant tags that represent the type of information you are displaying. Proper use of heading tags and paragraphs might seem like a simple thing to do but so many people just don’t think about HTML on even such a basic level.
With a good understanding of the information you are presenting and an awareness of the pitfalls that lie ahead you can then employ your own web design version of the stop hit / kick to make sure you stop things before they get out of hand.
In case you are wondering what I mean, here are some simple examples of what I would consider to be stop hit / kicks in the land of web design:
- Plan the structure of your document before you begin to code it
- Use minimal markup to achieve your desired results, choose your id’s and classes carefully as you probably don’t need as many as you think
- Use CSS to style your document and be sure to use shorthand to save yourself both time and bandwidth
- Try to keep things simple, I for one am bad for coming up with some crazy ideas but simplicity is very powerful when it comes to building a website, always ask yourself is that really necessary before going ahead with something. Just because you can, it doesn’t mean you should!
B. Simultaneous parrying & punching
When confronting an incoming attack; the attack is parried or deflected and a counter attack is delivered at the same time. Not as advanced as a stop hit but more effective than blocking and counter attacking in sequence. This is also practiced by some Chinese martial arts. - Wikipedia
I think building websites is a pain in the ass but I still love it, just like in a fight you are constantly jostling for position (or maybe I should heed my own advice) and maneuvering the pieces of your web page puzzle into place. A good understanding of CSS bugs is a good place to start, I’m not going to claim to know them all inside out but I have a good idea of how to get to the bottom of a problem.
Even the best laid plans go to rest as some folk say, in the event that you do run into trouble it is important to have a backup plan and that is where debugging comes in. The beauty of building tabless web sites is that everything is done at the block level, you are dealing with chunks of code and a document tree which allows you to work your way back until you have a solution.
The way I tend to work is to isolate what is causing the problem by creating a test case, I re-save the document I am working on and then start to remove parts that do not affect the problematic area. For example, I might remove everything within a navigational area but keep the navigation block in place to see if that has any affect, if it doesn’t I might then move onto a content chunk and remove that.
This is largely a trial and error process and can sometimes take a while but eventually you end up with what I call a test case, the bare minimum of code required in both a CSS stylesheet and HTML document to replicate the error. Once you are rid of all the non essential components it is then much easier to find a solution to your problem and once you have done that you are free to carry on as you were, much closer to your goal of winning the fight.
Simplicity is again key in this technique as you are cutting away the clutter in order to have a moment of clarity.
C. No high kicks
JKD practitioners believe they should target their kicks to their opponent’s shins, knees, thighs, and mid section. These targets are the closest to the foot, provide more stability and are more difficult to defend against. However, as with all other JKD principles nothing is “written in stone”. If a target of opportunity presents itself; even a target above the waist one could take advantage of the situation without feeling hampered by this principle. - Wikipedia
I have talked in this article about how you should keep things simple and how simplicity can help overcome problems but what about doing all the funky stuff? I would class this as a high kick and should be used sparingly which brings me to the concept of progressive enhancement.
Progressive enhancement is the high kick of web design, you can take an already stable, well constructed page and add little niceties that add value to your user experience and a little bit of flare to your page. There are many ways in which you can enhance you pages but any enhancements must degrade gracefully.
For example, an .htc file can be used to allow you to use the hover anything technique in Internet Explorer. By making good use of JavaScript & the DOM you can do all sorts of lovely effects that are just not possible by using HTML alone, sprinkle a little bit of the XMLHttpRequest and the Hijax technique and you can be doing server requests on the fly to update your page without leaving it. These techniques can be used to great effect by adding visual cues for your user and creating a more seamless browsing experience but they also have their pitfalls if done wrong.
I once saw a beautiful technique which is only possible in the Safari browser where you can add really nice drop shadows to text, this technique is fine but just won’t work in other browsers, Mike Rundle has done a great write up on how he did the site if you want to read more about it. Another technique you may want to implement might be using Microformats to add another semantic layer to your document, embedding usable data within your existing code that adds even more value to your finished product.
One last thing I wanted to bring up on this point is MOSe which I think is a totally sensible way of approaching progressive enhancement.
MOSe relies on IE6’s inability to pick up child and adjacent selectors, or > and + as they’re known by. As well, some basic CSS3 selectors are becoming more and more usable in everything but IE (see CodeBitch’s CSS3 support chart) so we can use these to our advantage as well. - Dave Shea
I think and often forget that using attribute selectors and some other CSS3 can be an immensely powerful, think about simple things like styling external links for example. Visible to good browsers and not slightly less advanced browsers, completely valid and a perfect example of progressive enhancement.
So where does that leave us? High kicks are always impressive, although screw them up and you are likely to cause yourself an injury and this is why you should not rely on them to get a job done. Wow factor is just wow factor and if the rest of the puzzle isn’t in place it doesn’t hold much water, there are many sites out there on the web that have wow factor and no functionality… and that is even before we go to look at full Flash sites.
So, that about wraps this article up, web development is a fluid medium, things are always changing and just like a good martial artist, you should get yourself a good grounding in the techniques before you start trying to pull of fancy maneuvers. Bruce Lee got it right with JKD, understand all of the tools at your disposal and use the right tool for the job, don’t restrict yourself to one method when there is a more economical and effective technique to get the job done.
Exciting isn’t it?
October 26th, 2006
I love martial arts and last night whilst walking to the shop I realised that being a good web designer is like being a good martial artist. On that note I have decided to write a few articles that will take concepts from Bruce Lee (I love the concepts involved in Jeet Kune Do) and bind them to web design, I hope you enjoy them and feel free to engage me with any thoughts you have…
Empty your mind, be formless. Shapeless, like water. If you put water into a cup, it becomes the cup. You put water into a bottle and it becomes the bottle. You put it in a teapot it becomes the teapot. Now, water can flow or it can crash. Be water my friend. - Bruce Lee
How many times have you nudged a design into shape via the beauty of CSS only to find it has popped out of place in another browser? Web design is a fluid medium, everything you do has a knock on affect on other elements on your page, nothing can be pixel perfect and you can never guarantee how your user is going to be viewing your site.
One of the most crucial aspects of designing a good web site is being able to read these reactions and incorporate these fluctuations into your design. Do not think in resolution for the screen only, anticipate all of them and how your different elements will flow in each environment, be flexible and you should be just fine.
This philosophy does not only apply to the front end, the back end of your site must also be able to agile, are you thinking of the bigger picture? Will your site scale? Is your database architecture well done? Could you take parts of your database and easily reuse the data without having to do any extra work to move it to a new format?
In my past experience I have worked on projects that have contained one set of data but grown to contain more and more data, in turn this has had a knock on effect on the structure of the front end of the site and also the design.
Planning at the beginning of a site is paramount, you should analyze everything you would like to have before you even start to build and then look at how you can do this. Understand that at a later date your site may change to incorporate one of the things you want and prepare for this before hand, be flexible before you need to be!
October 17th, 2006
Whilst trawling my RSS feeds today I found out that my friend over at Renegade Zen has taken the time to make himself into a South Park Character using a rather fun tool over at http://www.sp-studio.de/. He has encouraged everyone else to take part so here is mine…
I look forward to seeing what you all get up to with this so please ping us both back so we can check ‘em out.
Have fun!
October 14th, 2006
On browsing what has become one of my favourite sites Notcot I came across an artist I had not encountered before and I have to say I am hooked, his name is Luke Chueh and his artwork rocks.
I’ve created a tool I call “The Color Wheel of Doom.†In my color wheel, I’ve designated each color with a particular mood or action. Blue represents depression, green represents pestilence, red represents violence and bloodshed, and orange represents insanity. I’ve chosen yellow and purple to function as “wild†colors that can be used for any scenario I deem fit. However, I’ve found purple/violet to be a difficult and unsettling color to work with. I guess I simply haven’t conceived of any purple ideas.
Color Wheel of Doom = Frickin awesome concept! How many times have you been trying to come up with a colour scheme for a site and how many times would a color wheel of doom have brightened up the process?
I have been spending a bit of time recently getting reaquainted with some cool stuff, for ages I did a lot of research and learning online so have been really enjoying cruising round toy sites and design sites when I have had a moment to breathe. I have to say I am so glad I found this artist, it was even nicer when I was having a look around his site to find his fans paying homage to him with works based on his creations.
I quite like toys like Gloomy Bear, I think there is something funny about the macabre cute and the work that Luke does has definitely got that edge to it. One of my favourites has to be this one called The Exit…
I am also a big fan of this one…
What do you think? I think they are awesome and will probably keep going back to see if there are new works that he has done, I know that I will probably work some of them into my own desktop pics at some point. Not for public consumption, just so that I can enjoy them myself, I have working 10 desktops in my Ubuntu installation and I use a program called Wallpapoz to give them different backgrounds so I could have a full theme going on with his artwork.
Maybe I should set up my own desktop mood color wheel as that could be fun, oh and by the way… I HATE THAT SPELLING OF COLOUR, I spend so much time coding CSS that I end up just going with the flow now if someone is already using it (i.e. in the blockquote used above).
Anyway, I hope these pics brightened up your day, they certainly entertained me for a good half hour and more and will continue to give me enjoyment. I think I will write some more about some artists I like in the future…
October 7th, 2006
Well, that’s about done it for me, I absolutely have to become a millionaire now so that I can embark on lunar adventures, the beauty of it all is that I can get it all for cheaper given the strength of the UK currency. I reckon this is probably the coolest thing I have ever seen for sale online so I think I might add it as the number one item on my non existent wish list.
Richard Branson deserves a hat tip bigger than any other available, this is truely the dogs nuts Check out stellar travels for sale at Neiman Marcus Online and feel free to take me with you for telling you about it.
You can find out more at Virgin Galactic which deserves another hat tip for probably the best ever URL purchased!
October 6th, 2006
Well I don’t know about you but I love super heroes however there have to be thousands of ways to make fun of them via the medium of bad jokes hence this weeks theme. My main image is of one of my favourite TV shows ever but I have decided that my joke will have to be about a member of the X-Men.
Q: How can you tell there’s been a member of the X-Men in your Fridge?
A: Claw marks in your butter.
October 3rd, 2006
This is a definitely a picture worth sharing which I found by accident this morning, hope it makes you think that little bit more creative for the day. It certainly has me ready for action!
