My Writings. My Thoughts.
CSS: Gradient Text Effect
// July 1st, 2008 // No Comments » // Tutorials
Do you want to create fancy headings without rendering each heading with Photoshop? Here is a simple CSS trick to show you how to create gradient text effect with a PNG image (pure CSS, no Javascript or Flash). All you need is an empty <span> tag in the heading and apply the background image overlay using the CSS position:absolute property. This trick has been tested on most browsers: Firefox, Safari, Opera, and even Internet Explorer 6. Continue to read this article to find out how.
Continue Reading
Typographic Contrast and Flow
// July 1st, 2008 // No Comments » // Tutorials
As you have probably know, most online readers don’t read line by line, instead they scan (from one point to another). For this reason, designers create typographic contrast and flow by emphasizing certain text. Contrast is important because not all the content within a page have the same value, some have greater significance than the others. By creating contrast, you can direct the reader’s attention to the important messages and at the same time enhance the visual appearance. Here are seven basic methods on how you can create typographic contrast.
Continue Reading
CSS: Decorative Gallery
// July 1st, 2008 // No Comments » // Tutorials
Did you like my previous CSS tutorial on how to create gradient text effects? I’m using the same trick to show you how to decorate your images and photo galleries without editing the source images. The trick is very simple. All you need is an extra <span> tag and apply a background image to create the overlaying effect. It is very easy and flexible — see my demos with over 20 styles, from a simple image icon to a rounded corner to a masked layer (both decorative and complex).
Continue Reading
Advanced CSS Menu
// June 30th, 2008 // No Comments » // Tutorials
This tutorial I will show you how to slice up the menu design (step by step) and put them together with CSS. Most of you probably know how to code a horizontal or vertical CSS list menu. Now let’s take it to the next level — code an advanced (un-typical) list menu utilizing the CSS position property.
Continue Reading
CSS: The All-Expandable Box
// June 30th, 2008 // No Comments » // Tutorials
In HTML, if you don’t specify a specific width, block-level elements are vertically expandable by their nature. Think of an unordered list. That list will grow be be as big as it needs to be to fit all of it’s list elements. If a user increases the font size in their browser, the list will expand vertically, growing to fit the larger content. Sometimes it feels like vertical-only expansion is limiting and it would be nice if the element could grow horizontally as well as vertically with a font size increase by the user.
Continue Reading
Photoshop: Secret Shortcuts
// June 30th, 2008 // No Comments » // Tutorials
It is proven that by using software shortcuts can boost up productivity. Here are 30 secret Photoshop shortcuts that I’ve learned from years of experience. Well, what I mean by “secret” is that these shortcuts are not documented in the menus. Keep reading and you will find how these shortcuts can speed up your productivity. I bet you don’t know all of them.
Continue Reading
Startdrawing.org
// June 30th, 2008 // No Comments » // Inspiration
I recently visit this site, startdrawing.org, and I would like to recommend to you. They are a web portal that showcase the talented artists and illustrators in Asia. It is a great place to search for illustration inspirations.
Continue Reading
How to Design Mini Icons
// June 30th, 2008 // No Comments » // Tutorials
Numbers of people have asked me how to design my popular Mini Pixel Icon pack. In fact, they are relatively easy. All you need is just some basic Photoshop skills. Here I will show you how to use the Pencil tool to design pixel icons, and then re-use them to create a full collection. This is the technique that used to create over 320 icons within a day.
Continue Reading
Intel Unveils 80 Core Programmable Processor
// June 30th, 2008 // No Comments » // Technology News
Intel unveiled today an 80-core processor that delivers Teraflop — or trillions of calculations per second –performance on a single chip. Although has no plans to bring this exact chip to market, it believes a similar design could be available on the market five years from now. “Our researchers have achieved a wonderful and key milestone in terms of being able to drive multi-core and parallel computing performance forward,” said Justin R. Rattner, Intel’s chief technology officer. Continue Reading
Sony Crowns Blu-ray Disc as Winner Over HD DVD
// June 30th, 2008 // No Comments » // Technology News
Sony Computer Entertainment America issued a press release today announcing that since the release of the PlayStation 3, with more than two million units shipped worldwide, Blu-ray Disc has experienced “tremendous growth in consumer adoption.”
Continue Reading