robots-design(tm)
The skin colors for this blog were derived from this image, using robots-design(tm)
robots.design(tm) is a free hosted utility that allows you to upload an image, as well as a collection of color attributes from a site's CSS, and maps the image colors into the CSS colors, ultimately generating a list of sed commands that can be used to skin the application colors from the image. The colors on this skin were applied with robots.design(tm).
Link to robots.design(tm)Further Application Notes
robots.design works very well through upgrades, in this case, with dojo. Using the tundra theme, I can reskin an application - including dojo/dijit very quickly.
Some colors should not be changed - specifically error and warning displays which are traditionally red and yellow respectively. A backup of the CSS files was invaluable, since a dojo upgrade only required CSS upgrades for the dojo files (dojo.css, dijit.css, tundra.css).
Application Delivery Networks - An Excellent Application of robots.design
Link: http://know-waste.com/2008/11/25/adn-application-delivery-network
The link above suggests integrating diverse, externally hosted applications with polished designs. This is an excellent use of robots.design, because the volume of design translation may be massive.
The basic approach would be to identify those CSS files related to color, get the color attributes, and apply new colors using robots.wizard. You could skin many applications, very quickly, even if their original color schemes were very different.
The key to success will be to limit the skin colors, and augment them with images. If you have a very complex, colorful, comp, the variation in target application color schemes may make it difficult to get a consistent color set out of robots.wizard. You can remove colors from the image, without modifying it, in Step 1 of robots.wizard.
Contact Form Fixed
Sincere apologies to those who tried to request information through the contact form on this blog. I have changed it to use the http://know-waste.com contact form and tested it carefully. Comments and inquiries are most welcome.
More Cost-Effective Design Strategies
- Work within application design architectures. In other words, try to use as much of their HTML and CSS as possible, or replace just the CSS. Most good applications have a nice hierarchical CSS and template organization. Learn to work with it. Many application allow the addition and removal of widgets and tools from the admin interface. Accomodate that and support it. Its is extremely valuable.
- Use icon sets. They will allow you to provide a beautiful interface in a fraction of the time. http://www.everaldo.com/crystal/. Support these projects if possible, ask your employer.
- Use toolkits, but carefully. If it is a simple feature, code it yourself. If it is complex, find a toolkit or javascript library.
- Keep the layout and colors separate in the CSS. That way, you can reskin an application in different ways, easily. Use browser specific overrides where necessary.
- If you are building an application use a hierarchical template structure and create components that can support the whole system, instead of just one page.
Fast Page Added
Link: http://robots-wizard.com/robots.design/run.php
This is a faster version of robots.design. There are no demo connections, and the interface is simpler.
The remainder of the code is the same.
:: Next >>