Flash Catalyst

October 30th, 2009

Adobe Flash Catalyst is a new professional interaction design tool for creating expressive interfaces and interactive content without writing code. Create interactive portfolios, product guides, microsites, site navigation, interfaces for RIAs and more, including transform artwork created in Photoshop, Illustrator, and Fireworks into interactive designs, create interactive prototypes with the ability to leverage them in the final product, publish a finished project as a SWF file ready for distribution, also work more efficiently with developers who use Adobe Flash Builder 4 to create rich Internet applications (RIAs). Designers use Flash Catalyst to create the functional user experience then provide the project file to developers who use Flash Builder to add functionality and integrate with servers and services.

New Beta 2 release adds support for video, sound effects, motion easing, AIR and more. Create the user experience through an approachable interaction design tool for designers with no coding required.

Discover more on Flash Catalyst

iPhone wedding cake

October 28th, 2009

iPhone wedding cake, made by Charm City cakes for Jerry Brito’s May wedding, is one of the most incredible displays of real-life Apple adoration we’ve ever seen.
iphone wedding cake

Photoshop CS5 demonstration

October 17th, 2009

Photoshop CS5 will be released soon and it introduced some amazing tools and technique which will blow up your mind. Below is a demostration by Russell Brown “from the labs” – the painting and warping technology.

Check out more on Adobe CS5

Interesting infographics

October 16th, 2009

Article on Web Design Ledger

What people are doing online
people doing online
The exploding internet
exploding internet

Rotating Firefox

October 13th, 2009

Article by Stan Schroeder on Mashable

“Actually, it’ll only be rotating if you use it on a laptop that has a built-in accelerometer, similar to the one found in the iPhone. But still, the fact that the new version of Firefox (Firefox) (3.6) can recognize your screen orientation and adapt accordingly is awesome and signifies that we’ll see more and more accelerometer-equipped lappies in the future.” Read more on CNET news

LG – solar powered e-book reader

October 12th, 2009

Article on Barb Dybwad on Mashable

The thin-film solar cell featured in the e-book measures 10 centimeters in width and length, it was developed to perfectly fit the 6-inch display panel for e-book currently mass produced by LG Display. The solar cell measures 0.7 millimeter in thickness and weighs a mere 20 grams, the less thickness of a credit card and the weight of a fountain pen.
The thin-film solar cell is produced by placing electrodes onto a glass or plastic substrate. Contrary to widely adopted crystalline solar cells that employ silicon wafers, the thin-film solar cell is generally light-weight and easily adjustable in size and form for applications such as e-books or mobile phones.
LG solar powered ebook reader
The current energy conversion efficiency rate of this product is approximately 9.6 percent. Exposure to sunlight for about four to five hours would extend the running time of the e-book’s battery by a day without the need for additional charging. This would allow longer outdoor use of the e-book and lessens worries about battery discharging.

Understand internet speed

October 10th, 2009

internet speed
Article on Make Use Of, Guy McDowell talks about how internet connection and internet speed work. If you have questions like “Why does the speed test tell me I can download this 3 Mb video in 2 secs, yet it keeps stopping?” Or, “My speed test tells me my upload and download speeds are 512kBps. Why won’t my Skype work better?”, you should check out this article.

Adobe AIR Apps for Designers

October 10th, 2009

Adobe Integrated Runtime (AIR) is a cross-platform program that allows you to run a wide variety of different little programs. Web designers can find a slew of handy programs that will ease their job. Some of the tools you can find include choosing a color scheme, measuring spaces in your design, editing vector images and a whole lot more.

Color Browser allows you to locally organize palettes that you’ve created in Adobe programs, Kuler or ColourLovers by importing the ASE files.
color browser

Kuler desktop allows you to import palettes from the Kuler website, browse and search other themes for inspiration, and import selections you wish to use into Creative Suite 3 Illustrator, InDesign and Photoshop. You can also get RSS feeds of Highest Rated, Most Popular, Newest and Randomly Selected themes to keep the inspiration flowing at any time.

Calilper floats above other applications on screen and can be used to measure anything on your monitor.
Pixus – A super easy pixel measuring tool that will allow you to measure anything on your computer. Simply open it up, drag it to fit the area you want to measure and you’re done. You can also preset various sizes so you won’t have to constantly drag the borders to what you need.

ImageSizer is an application built to resize, rotate, optimize and rename a batch of images, outputting them as a single compressed zip file

.merlin – A trueType font tool which will help your organize your collection, rename files and delete duplicates.

Icon Generator – A handy tool that will let you create Web 2.0 or Adobe CS3 style icons in just three steps. Images can be sized at 128×128, 48×48, 32×32 or 16×16.

Wireframes in Web Design

October 9th, 2009

Article on OnextraPixel

Designing wireframes the right way the first time, cost no more than doing it the wrong way. Creating a paper prototype adds no cost, either- simply print out the wireframe diagrams for the pages a visitor will use to complete the tasks most closely related to achieving his goals and meeting the site’s business objectives.
Web Prototyping saves costs of any marketing communication that may be necessary to undo brand damage resulting from poorly functioning web site and a frustrating user experience. Expensive site redesigns are often undertaken to correct those kinds of problems. Adding a few days to create a wireframe and test a prototype ensures that the redesigned site won’t introduce any new causes for user frustration or further erosion of brand equity.
A wireframe diagram illustrates the layout of a web page, using different shapes (such as boxes, ovals, and diamonds) to represent content, functional, and navigational elements and show their placement on the page. HTML coders use the diagrams to “wire” each page, connecting links, attaching content, and so on. A wireframe diagrams lets everybody focus on what’s important at this step: clearly understanding what goes on each page, where it goes, and why it goes there, so you can achieve the best overall balance and structure for each page. A wireframe is a sketch of a page-layout idea.

Wireframe vs. Visual Design
wireframe vs visual design
A wireframe diagrams lets everybody focus on what’s important at this step: clearly understanding what goes on each page, where it goes, and why it goes there, so you can achieve the best overall balance and structure for each page. A wireframe is a sketch of a page-layout idea.

9 Application Tools To Create Wireframes Digitally
01. Balsamiq
02. iPlotz
03. Pencil Project
04. templatr
05. Flair Builder
06. GUI Design Studio
07. Proto Share
08. Serena
09. DUB

The Art of Branding

October 9th, 2009

Article on Web Designer Depot

No wonder people under estimate the power of branding, it’s not only design, it also involve concept and philosophy. Indeed, branding is everywhere in your daily life. The article basically have a closer look at ways to define a brand for something as unique as a freelancing business, and what one needs to do to get started on the right track to a successful brand.
set goals & business plan
01. Define your business goals
02. Define your target audience
03. Business name
04. The logo
05. Website and business card design
06. Write an elevator pitch
07. Write an about page
08. Get client to reach you
design logo

Flash CS5 – Applications for iPhone

October 8th, 2009

Adobe announced that Flash developers will finally be able to create iPhone-compatible Flash games. Flash CS5 (not release yet) will have a feature to export AS3 projects to native iPhone applications. This feature does not mean that the iPhone and iPod touch will be able to understand Flash files or that its Safari browser will be capable of running Flash movies, but it means that Flash developers will be able to use Flash CS5 to make native iPhone and iPod touch applications and games by using their existing ActionScript 3.0 skills.
iPhone App
View the Demonstration Video on Adobe. For developers the new tooling will be made available with the Flash Professional tool, the beta version will be available to download before the end of the year.

Related articles on Adobe and Flash Mobile Blog

Add More Sparkle with CSS3

October 6th, 2009

Article on SitePoint

“Over the last few years, best-practice CSS development has shifted from graceful degradation to progressive enhancement. And buoyed by the progress of modern browsers and the demise of older browsers, the excitement about what is possible right now is increasing. More and more designers are considering how to provide the best user experience possible for each browser without risking compatibility.”
With all the new features on CSS3 like rounded corners, custom fonts and RGBA colors, it’s more fun to style your webpage. Think about making a button without creating an actual image, how handy it will be. The only concern is most of the features only work in the latest browser.

Choose the perfect CMS

October 5th, 2009

Article on Noupe

The content management system you choose can really make a huge difference in how much time you (or your clients) spend keeping a site updated and maintained.
Below are ten useful guidelines to consider when choosing a CMS:
01. Function suitable for your website
02. Needs to work intuitively
03. Backend needs to be standardized
04. Backend needs to be logical and well-organized
05. No need for extra functionality you’ll never use
06. Easy for non-geeks to use
07. Need to include a WYSIWYG editor
08. Pages should be fast-loading and have simple code
09. Template engine should allow you complete creative control
10. Adequate support and documentation

Ten Excellent CMS Options (Author choices)
01. Wordpress
02. Radiant
03. Silver Stripe
04. Joomla
05. TYPOlight
06. Frog
07. Textpattern
08. Expression Engine
09. Drupal
10. CMS Made Simple

Object-Oriented CSS

October 4th, 2009

Object-Oriented programming (OOP is the short term), I first heard about it in the Flash class. Breaking one massive file into several small files so we can have better organization, the code would run more efficiently, and most importantly is make life easier for ourselves if we want to make changes in the future. Indeed Object-Oriented is getting more popular on different programming languages.

OOP is a computer programming style that uses “objects” – data structures consisting of datafields and methods together with their interactions for designing applications and computer programs, according to the definition on Wikipedia. On Net.Tutsplus, there’s an article talks about this concept.

Introduction to Adobe Air

October 3rd, 2009

Article on Net.tuts

Adobe Air

Adobe Air is a framework which allows building desktop applications. Adobe Air applications are based on two technologies: Html/Js and Flash. Developers can choose to build desktop application via Html/Js, Flash or Flex. After a brief overview of the architecture, we will build a simple application using Html/Js.
Step 1 – Architecture of an Air application
Step 2 – OS level functionalities
Step 3 – Installation
Step 4 – Configuration
Step 5 – Project creation
Step 6 – Running the application
Step 7 – Deploying Air application