By Electric Pulp
Open the Mac App Store to buy and download apps.
Duo is a dual-paned web browser built for Responsive Web Design (RWD) that lets you browse the web in two views: your standard ‘desktop’ view as well as a typical ‘mobile’ view. By seeing these two views at the same time, you’re able to quickly test and work through multiple screen experiences rather than considering them separately.
Whether you’re a designer or a developer, project manager or client, Duo gives you a new tool to make your Responsive Web Design project go more smoothly than ever.
Get the bookmarklet: http://helloduo.com
• MOBILE VIEW
Duo gives you an adjustable mobile view using the left pane.
• TABLET / DESKTOP VIEW
The right pane defaults to an adjustable tablet / desktop view.
• SYNCHRONIZED BROWSING
Navigating in either pane updates the other. No need to reload layouts to view pages at different sizes.
• WEBKIT DEV TOOLS INCLUDED
Duo has everything you need to make sure your design is doing what it should. Debug code in either pane.
• CONVENIENT KEY COMMANDS
Duo includes tools for clearing your cache and getting rid of those pesky cookies via standard key commands.
• LiveReload SUPPORT
Duo now includes support for LiveReload.
• HANDY BOOKMARKLET
Use the convenient bookmarklet in your other browsers to push a site over to Duo. Get the bookmarklet: http://helloduo.com
WHAT IT ISN'T
Duo is designed for Responsive Web Design, not for user-agent sniffing. Duo also only refreshes both views for GET requests. It's probably not a good fit for your POST refresh heavy project, although we are actively looking at ways to accommodate this.
LET US KNOW YOUR THOUGHTS
You can email firstname.lastname@example.org for support, or reach out to us on Twitter: @electricpulp. Thanks!
What's New in Version 1.3
Application does as advertised. A great way to quickly test multiple screen sizes.
Love the fact this has live reload support now. Duo has become a super handy tool to quickly test how things will look on multiple screensizes. It has a built in inspector, like Safari’s dev tools (which are prettier than Chrome’s IMO, but not as extendable… but I love how Safari can display minified CSS as expanded).
Just a suggestion or wishlist item: I wish I could add it to my Alfred Workflow, not sure what would need to happen to add Duo to the "Open URL with” option. Maybe it is already doable and I am not accessing it correctly?
Not real mobile view, very limited options...
Just purchased and tried, here is what I found wrong:
1. The mobile view gives you a “frame” of your website, and not the “real view” of it on a real mobile device. In other words, on my mobile phone I can see my complete website page, reduced in size of course, fitting the full screen, whereas on this program I can see just a portion of the screen without size reduction which is not the real view you get on a mobile device.
2. There is no way to access any settings to target specific screen devices. I really expected that!
For me, this app is useless and deceptive. To test my website for repsonsive design, I am going to use a real device.
Almost there ...
I love the simple user interface. And this really helps when previewing fully responsive sites; but if also let you set the user agent … that would make it complete, to me.