Min Tran

Design. Rock and Roll.

Design in browser

“Design in browser” is the most discussed topic around our community in the recent years, even though it's not a new concept. The first websites were created in browsers, then Photoshop came out and became a popular web design tool because there was no better choice.

A majority of my works are complex web applications with fast pacing development cycle. Design in Photoshop adds an extra layer of complexity into my workflow, which I and my clients couldn't afford. I found it's much easier and comfortable to design and develop using two basic tools: Sublime — my favorite text editor and browsers.

Photoshop is not made for application design

Design is how it works.
— Steve Jobs

Web design is all about user experience. Designing in Photoshop (or other graphic design applications) doesn't give us the sense of user interaction. Presenting a hover state in a static design comp to your team could be very awkward. Have you ever drawn a table with 20 columns and 300 rows in Photoshop? Most of the time, we use Photoshop for repeatative tasks. I believe that the many of us are using Photoshop to create design previews.

Nothing beats the real experience. Design in browser provides the context. The browser shows how the design looks like and how it interacts with users.

Design in browser is faster

Throwing away an unnecessary step means faster development process. Switching back and forth between Photoshop and coding is painful! It really slows down the development speed, especially in agile enviroment.

The days we use Photoshop to create graphic for the web are long gone. HTML5 and CSS3 are mature. I hardly can think of any user interface elements couldn't be done using just HTML/CSS. Not to mention new technologies like SASS, LESS, ... and CSS frameworks are ready for us to design, code and prototype rapidly, at the same time.

We should embrace design in browser method. It fills the gap between design and development and comebines two steps into one.

comments powered by Disqus