WebZap powers-up web UI design in Photoshop

Although quite a few developers advocate designing in the browser, not least because of RWD taking over, the fact remains many designers remain wedded to Photoshop when creating interfaces. The problem is, Photoshop was initially designed as a retouching tool, and although it’s taken on features for working with layout, it’s still a frequently clunky tool for dealing with web design.

Cazoobi Creative Solutions owner Norm Sheeran is one such designer who's remained fond of Adobe's giant. He told .net that he’s “always found Photoshop to be the most flexible app for design, and without a doubt it offers the most features”. However, having also been frustrated with Photoshop’s drawbacks, Sheeran has created WebZap, which he said was “a complete Photoshop plug-in with a number of different tools and workflows specifically for web developers”.

According to Sheeran, the project was in part inspired by his earlier creation, DevRocket, which provides the means for iOS app designers to rapidly create mock-ups: “It was readily accepted by the iOS dev community, and I got a bunch of requests asking if I could make something similar for web designers.” Immediately eschewing the idea of code output, Sheeran decided to focus entirely on creative visual design, that point when you “first fire up Photoshop and start thinking about layouts, colours and styles.”

The resulting plug-in enables you to create layouts based on a 960 grid system, with a web page broken up into three areas: navigation, feature and fold. “There are a range of different smaller layouts you can place in these areas, allowing you to create custom layouts within seconds,” added Sheeran, who pointed out these could work well when designing initial ideas with clients, instead of scribbling on bits of paper. In addition, the plug-in provides the means to quickly add form buttons, create text, and style text across an entire layout. The majority of components are editable, said Sheeran: “The only raster layers generated are photo images in placeholders, and they’re just for mock-ups, so you can replace them with your own. All UI components and text generated by WebZap uses standard Photoshop text and custom shape layers, meaning you can change things however you want.”

WebZap is available from webzap.uiparade.com, priced $15. Minimum requirements are Photoshop CS5.

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of seven full-time members of staff: Editor Georgia Coggan, Deputy Editor Rosie Hilder, Deals Editor Beren Neale, Senior News Editor Daniel Piper, Digital Arts and Design Editor Ian Dean, Tech Reviews Editor Erlingur Einarsson and Ecommerce Writer Abi Le Guilcher, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq.