Interface Styles 3: Make Mockups Faster Than Before

10 Reasons You’ll Love Interface Styles

  1. You get ten style palettes for one great price.
  2. You get free updates to any future version of Interface Styles.
  3. You get the files for both Photoshop and Fireworks so you can work the way you want.
  4. You’ll work quickly and beautifully with one click styling at your disposal.
  5. You’ll save massive time and energy from messing around with gradients and effects.
  6. You’ll make stunning mockups that will blow your colleagues and clients away.
  7. Your interface will finally have the crisp, pixel-perfect graphics that your users have longed for.
  8. Your interface will feel more professional and engaging to use.
  9. You’ll be able to recreate element styles quickly and consistently across your designs.
  10. You’ll always have an array of different interface styles to choose from.

Most designers spend a ton of time and energy to make beautiful, pixel-perfect mockups of their interface. With Interface Styles, you no longer have to. Interface Styles gives you the power to add polish to your interface elements in one click. Making mockups has never been this fast and easy. And the result will always leave your clients stunned and wanting more.



The single user license for one person is $27.00. The multiple user license for more than one person is $57.00. After you buy your license, you will receive an email to download the files. Check your spam and bulk folders if you don’t see it in your inbox.

Screenshots of Interface Styles

Soft shine buttons for an elegant look.

Hard shine buttons to make your buttons pop.

Inset buttons to lift your interface.

Pressed buttons for an impressive affordance.

Subtle buttons for dark interfaces.

Text fields for a beautiful form.

Web boxes to hold your content.

Knobs for your sliders and switches.

Fancy text for titles and headings.

iOS navigation bars for iPhone and iPad mockups.



elegant wordpress themes

This Post Has 26 Comments

  1. Erik Reply

    why not available for AI and/or PSD?

    Rather – please please an AI set and I will definitely be a customer 🙂

    • Daryl Reply

      These styles are for web graphics so that’s why they are for Fireworks since that is Adobe’s dedicated web graphics tool and what many serious web professionals use who focus on the web.

      • Photoshop and Illustrator User Reply

        That is seriously the stupidest remark I’ve heard in a while. I am a serious web professional and I use the serious programs: Photoshop and Illustrator to design. Fireworks in my opinion is for garage designers who’ve just graduated from school.


        • Rob Reply

          I know lots of serious web professionals who use Fireworks. So no, this is not a stupid remark. What’s stupid, is saying that Fireworks is for garbage designers, when Photoshop pretty much pioneered crappy filters, ridiculous lens flares, and is still being used to create horrendous fake HDR photos.

          • rafael

            Fireworks is more used than Photoshop for mockups. That’s why there is only the FW Style. 😉

        • Steve Reply

          Fireworks is an incredibly capable application – it’s not the toy you think it is. Photoshop on the other hand is over sized, over featured, and clumsy when it comes to web design.

          Both are amazing software. Fireworks is still around with good reason.

          • Dal

            @rafael, there is simply no way. Photoshop is the single most used graphics application, more than all other apps combined. It is the de facto tool for creating mockups, although perhaps it shouldn’t be.

            I agree with the commenter who said Fireworks is for mostly used by amateurs. Adobe have not kept up pace with recent developments in other apps. This doesn’t mean that if you use Fireworks you are not a good designer or an amateur, necessarily.

  2. HelloBillyGoat Reply

    I second that! Styles for .AI would be super. I’d buy it!

  3. Anonymous Reply

    Do you guys really use Illustrator for web mockups? :/

  4. Bill Dexter Reply

    “…and what many serious web professionals use who focus on the web.”
    I’m a serious web professional that focuses on the web and I use Photoshop and Illustrator.

  5. Victor Reply

    as a
    mockups > illustrator
    creation > photoshop

  6. Victor Reply

    as a web professionnal.

    mockups > illustrator
    creation > photoshop

    Can be nice to have those interface elements for AI and PS. The Firewokers are still happy, and the other web professionnals, start diggin your work and share it


    • anthony Reply

      The problem with PS is that it’s not a vector tool. The problem with AI is that the graphical controls are awkward to use. Nevertheless, I’ll see if I can make a PS or AI version.

  7. Boots Reply

    Yeah… I’ve been designing/building sites for 14 years and have never used Fireworks, even when I had it with the Macromedia Studio. I’ve also never worked with or known anyone that has used it as their goto. For me, the tools are Photoshop and Illustrator.

    • Daryl Reply

      The Adobe icons and splash screens for Photoshop, illustrator, and the rest of the Creative Suite in CS5 were all designed using Fireworks.

      (You’ll have to scroll all the way down near the bottom of the article part about Adobe Fireworks used for the CS5 artwork)

      So if you use Photoshop, then Adobe for one is someone you know that uses it as their “goto” when it come to screen designs. In fact, every time you open up Photoshop or look at Photoshop’s icon in your dock you are seeing and using the work of Fireworks.

      Not surprising of course since Adobe’s own website specifically refers to Fireworks as their design tool for web and screen graphics, not Photoshop or Illustrator. So it makes sense that is what they turned to when they needed to represent themselves and their products in the best way possible on your screen.

      I’m sure Adobe’s flyers, brochures, and other *print* material are designed in Indesign, Photoshop, and Illustrator though.

  8. Jammer Reply

    Why do you lot use Photoshop and Illustrator for Web Design and Mockup?

    You’re using the wrong tools for the job.

    Illustrator – Vector program mainly for print.
    Photoshop = Image manipulation.
    Fireworks = Screen Graphics and Website Design.

    If you visit the Adobe site, even they categorise their own programs like this. Check it out if you don’t believe me. Go and visit the Adobe site and read for yourself what each program is meant for.

    No one’s saying you can’t design sites very effectively in Illustrator and Photoshop, but they’re still the wrong tools for the job. It’s like using a monkey wrench to undo a nut, where you could just use a ratchet.

    Fireworks has loads more features geared towards a strreamlined workflow when designing websites that Photshop and Illustrator, even combined, can’t even begin to equal.

    Also, Fireworks is easil the best tool for designing screen orientated Vector graphics. In other words the sort of thing you might use a lot for designing websites.

    Where Fireworks cannot be used however, is in designing for print as it runs naturally at 72DPI (which is perfect for….. drum roll….. designing websites).

    Photoshop and Illustrator are bloated, clunky and slow for this purpose. Just watch the next couple of years as more and more web designers switch over to Fireworks. It’s inevitable, once they glimpse the workflow it offers.

    • Markos Reply

      @Jammer – I completely agree with you. I’ve been using photoshop for years and switched over to fireworks recently. There was an adjustment period for sure – but it is totally worth going through that. The benefits fireworks brings to the table for web design are fantastic.

      I still use photoshop for doing things like, say, photo manipulation, or hardcore image creation (which is what photoshop was designed to do) but for everything web based, from mockups right through to final art, Fireworks is the business.

  9. Avangelist Reply

    @jammer – Illustrator is more of a reasonable tool to use for web design elements today than ever.

    Illustrator creates vectors, PS and FW produce Rastors.
    Which one scales to different sizes?…

    • Joshua Reply

      That’s not true. Photoshop has always had shape layer graphics which are vectors. You can actually paste a vector from AI right into PS as a shape layer. Also Photoshop CS6 has vector tools similar to illustrator now. Mostly to fill the need of UI design for high pixel density graphics that are required for devices like the iPhone and iPad with retina displays.

  10. luke w Reply

    @jammer, thanks for the tip on fireworks – hadn’t looked at it since fireworks MX but it’s now a big improvement over PS for web design…

  11. Brad Becker Reply

    Fireworks occupies a spot somewhere between photoshop and vizio. Compared to photoshop, it’s more oriented toward objects and–imo–much faster to work on wireframes and lo-fi prototypes, faster to change properties of objects, etc. It’s also very focused on web/UI design. Where it falls down is quality (especially text rendering–but other areas too), print (by design), and in the overall lack of total investment compared to Photoshop. And, for the legions of Photoshop devotees, they actually have to unlearn behaviors to effectively use it.

  12. Ceteco Reply

    lol, everyone is so serious.

  13. Chris Reply

    This debate over the best tools seems pretty ridiculous to me … at least in this context. If everyone here is so proficient and gifted in the tool they’re backing so strongly, they wouldn’t even have need for these elements, they’d make them themselves using their program of choice.

    Thrown down some coin for the Interface Styles or get to work! 😛

  14. Rob Reply

    How do you all feel about Fireworks now that Adobe killed it? Illustrator is way better than Photoshop but honestly, just use what works best for you.

Leave a Reply

Your email address will not be published. Required fields are marked *