![adobe fireworks cs6 logo design adobe fireworks cs6 logo design](https://designmodo.com/wp-content/uploads/2013/02/fig1.jpg)
ADOBE FIREWORKS CS6 LOGO DESIGN PLUS
Plus there was that pesky problem of comp fonts not always resembling site fonts due to the rendering.Īnd when we moved to designing with web fonts, it was the opposite problem. We discovered that working with system fonts in Fireworks was faster for our designers, but build was slow because our developers had to interpret fonts and classes, resolve inconsistencies and negotiate font compromises with the designers. In working with fonts, we faced the same dilemma explained by the Typecast team: There, we could also accurately evaluate the effect of responsive layouts on the type as we moved through breakpoints. With this in mind, we did as much text layout as was needed in graphics applications and then explored the finer typographical details in the browser. Most designers would agree that their favorite graphics application does not provide an accurate preview of how text will appear in the browser. ( View large version) Typography and Typecast An sample style tile from Mojo Motors’ redesign process. To learn more about style tiles, I recommend also visiting Samantha’s website Style Tiles. It’s a truly responsive solution to visual design. Style tiles act as paint chips and color swatches for the interface that we can execute on any device or at any dimension. When an interior designer redesigns a room they don’t build multiple options of the designs they’re proposing, they bring color swatches, paint chips, and architectural drawings. A style tile is more refined than a traditional identity mood board and less detailed than a website mockup or comp. Style tiles are a flexible starting point that define a style to communicate the web in a way that clients understand. Websites are so much more than just usable interfaces: they tell a story… Samantha Warren explains the workflow pretty well in her article on A List Apart, “ Style Tiles and How They Work,” so I won’t go into deeper detail than this: They help to communicate a proposed common visual language and can be used to discuss style preferences that meet the goals of the stakeholders or client. Style tiles are a design document consisting of fonts, colors and interface elements that communicate the essence of the visual brand of a website or application. With this in mind, we ditched any elaborate branding exercise needed just for stakeholder buy-in and opted to create style tiles and a revised logo. We decided early on in the project that we would only do as much visual layout and style exploration as necessary in graphics applications - the rest would be done through an iterative process in the browser. Exploring Branding and StyleĪs discussed in the previous article, the design team decided on a pragmatic approach to creating visual elements. The transition to Fireworks was fairly straightforward - the Properties panel that spans the bottom of the screen, navigation of nested symbols, the symbols library and so on are quite similar in Fireworks and Flash.
![adobe fireworks cs6 logo design adobe fireworks cs6 logo design](https://mir-s3-cdn-cf.behance.net/projects/404/d894f3100169037.Y3JvcCw4MDgsNjMyLDAsMA.png)
Note: Gabriel was also familiar with Adobe Flash and its various features and quirks. For a detailed look at a similar workflow, check out “ Designing Interactive Products With Fireworks” by Nick Myers of Cooper and “ iOS Prototyping With Adobe Fireworks and TAP” by Shlomo Goltz. We were able to take advantage of the efficiencies built into sharing files and iterating on them together. Reusing wireframes as a staring point really helped us get from wireframes to high-fidelity visuals in record time. From this point forward, we’ve been using the wireframe files as the starting point for visual design screens. About a week later, he suggested working directly from the Fireworks PNG wireframe files, instead of recreating the designs from scratch. Because of the amount of work that would have been required, he decided to try Fireworks on a few screens. He initially considered just translating those wireframes to Photoshop. When Gabriel Gross (our visual UI designer) joined the team, we had already created a lot of wireframes in Fireworks. We found that PSD visual design files created in Photoshop for the same screen designs are much larger than those created in Fireworks - sometimes two to five times larger. The combination of integrated vector tools and bitmap-editing capabilities in one package, plus pages, states, symbols, styles and extensions, was something unique and worked best for us. Fireworks proved to be quicker for directly creating and manipulating visual elements on the screen than other tools, like Photoshop and Illustrator. As discussed in the “Creating Wireframes And Prototypes” section of part 1, our choice of a design tool came down to the following: