Almost nobody understood my earlier webapp idea, so I'll try again. Imagine you were looking at a website such as FriendFeed and you wanted to create a near pixel-perfect copy but in a way that you could move things around, adjust shadows, etc. I want a tool that makes that easy.
And without taking screenshots or copying the html, since the point is that it should have the power to quickly create something that looks just like our current ui. Also, it should be web based, because then fonts, etc will be right, and also I hate installing things. My previous attempt at explaining this: http://friendfeed.com/e... (Balsamiq is not what I want). It does not need to produce html though, so it can cheat anyway it likes.
- Paul Buchheit
So you wanna something like "html to png/psd"? Editable graphical interface with layers and stuff?
- Selim Yoruk
No, not at all. My point is that you could look at the the FriendFeed ui (with your eyes) and then create something that looked just like it.
- Paul Buchheit
Fireworks is pixel perfect, correct font sizes and previews image in browser. Yes/No?
- Toby Graham
Paul, I like the idea, it's got merit. There's plenty of tools that do half the job, that is, snip the page. The second part, i'm not overly familiar with the tools out there. The manipulation. I guess you could snip the page, and embed into your tool a js library, like scriptaculous, and attach special event significance to the controls/tags, for moving, dropping, dragging.
- Stu Andrews
I think I get what you mean now and I agree. That's not very helpful but hey. In the mean time you could edit the page live using firebug maybe?
- Toby Graham
It seems to me like you want the Visual Studio Win Forms designer for web apps hosted and served to designers as a web app. Drag and drop elements onto the page and adjust their properties in a property grid. Then send a link to others so you can share your concept.
- Eric Schoonover
For this, I use simple vector graphics editing app, like Xara or InkScape - I just make screenshots and use them as raw building blocks - usually I cut out from them small elements like controls/text-blocks/images/etc... In vector graphics enironment managing such kind of blocks is much more easier than in photoshop.
- Phil Smirnov
remembers that this idea has been described by David Siegel in 1997 in his book : Creating Killer Web Sites (http://tinyurl.com/5skw63)
- Oaksun
Paul, i think the edit-page command on ubiquity with the ability to: visually edit css and publish the changes is close to what you are describing.
- Ian
Eric pretty much nailed the description of the dream tool that I think Paul was asking for. In my dream the web app is truly collaborative and has an active GUI. So you can adjust those properties using a mouse or tablet and anyone else on your design team can watch as you do it so they can make suggestions and modifications as you work.
- David Muir
Let's say you want to make a mockup of FriendFeed called "FriendFood". You want it to generally have the same layout, only the top blue bar will actually have a background made of lasagna and a font that is made of French fries, and what shows on the page is everything people write about food on the regular FF, like "pasta OR bean OR potato OR steak". But you'd like someone to be able to do that from the web and without messing into much coding. Is that it?
- Rodrigo Jaroszewski
Could you achieve it by using Firebug and tweaking the CSS?
- Shakeel Mahate
So something with the usability of say, omnigraffle, but that only used webkit for its rendering. With text controlled and positioned by actual css so that line spacing etc were correct, although again with a simpler UI than CSS has.
- Robin Barooah
Paul - I _just_ came across a site that did exactly that. Unfortunately, Safari's browser history is failing me and I can't find it anymore. Doh!
- Patrick Lightbody
Paul, not sure if you're still reading, but are you looking for interaction design changes as well, or just appearance?
- Mark Trapp
I had never heard of Pencil, but it sure looks a lot like what I think Paul is describing.
- Jason Wehmhoener
I use ScrapBook Firefox extension to capture the page as is, and then edit that using Firebug.
- Jughead
Paul, I totally got you first time - anyone who thinks it's not a good idea has plainly misunderstood :-) It's the next step up from sketching out your UI on paper, n'est pas?
- Slappy Line
One quick tip in Photoshop is to turn off anti-aliasing and use your various web fonts (Arial, Verdana, Helvetica, etc.) and use your preferred font size in pixels/points... This will provide you with screen accurate font appearances and sizes. The biggest problem with a "pixel-perfect" browser rendering is that it will never be consistent from browser to browser. They all render ever...
more...
- Nathan Chase
Hey now, LG, Looney Tunes is frakking awesome. How about Disney buying Pixar? Oh, wait..... (and actually, that one hasn't worked out badly, so is there yet hope?)
- Jandy, ConcertMaven of FF
++ Jandy -> How about Dreamworks buying Studio Ghibli?
- LogEx
*smacks MVB* How DARE you besmirch tinker toys!!! Oh, and what's up with fiddling with your name, you trying to make me get MDV and MVB confused?
- FFing Enigma (aka Tina)
"In the paper, we present a new technology that enables computers to quickly and efficiently identify images of more than 50,000 landmarks from all over the world with 80% accuracy."
- Ian
from Bookmarklet
"An LED light that changes color by certain conditions such as when your favourite football team scores, what the current weather conditions are like etc. The information is downloaded from Internet with a WLAN adapter built-in into the LED. The light is recharged during the night. The idea is based on how the Allianz Arena outside of Munich works, changing color due to which team is currently playing. Storing the light on your TV or living room table while you watch your favourite soccer team playing you feel engaged and excited as if you were in the stadium itself!"
- Ian
from Bookmarklet
One thing I have noticed is that in any ovie, v show, etc where anything odd happens, the English are always portrayed as standing in place saying something like "This can't be happening" or some stupid thing like that, when it clearly IS happening. Is this some sort of national trait? I like to think that if, say, the dead rise and turn on the living, I would fight back + run to safety FIRST and worry about the ontological implications after.
- Neal Jansons
Laugh, sure. But your pounds sterling end up in a California bank account. ;-)
- Chris Baskind
My cousin dl'ed the Moron Test and tried to get me to take it. I told him he'd already failed because he was a moron for buying it in the first place. He was unamused. I wasn't.
- tinypants - Hagitha of FF
To be fair, he's kind of a tool, so it's less a reflection of the app and more a reflection of how much I want to throw him off the nearest high-rise.
- tinypants - Hagitha of FF
I notice that the U.S. is no longer a nation of morons -- for the last few days, "The Sims 3" is #1, so we're now a nation of replicants.
- Stephen Mack
got this after my first intelligent use of ff filtered search. populist USA likes to feign ignorance and UK likes to superficial awareness
- Lane Rapp
"The glass spheres are filled with a colored liquid and float up and down according to changes in the temperature. When the temperature rises the spheres will sink and inversely when the temperature falls the spheres will rise due to changes in the specific gravity of liquids."
- Ian
from Bookmarklet
"OUiP! is a hand-held device designed with children and adults in mind, developed for the industrial design and ideation company think/thing. The primary mode of interaction with the device is through motion, by way of tilting, turning and shaking. OUiP! also responds to sound input via a built-in microphone. Several interactive graphical programs were designed to showcase its features and encourage learning and exercise activities. This project is created from ground up around the open-source Linux platform. OUiP! is a little computer based on EM-X270 embedded mobile device board by Compulab, interfaced to custom electronics with accelerometer & microcontroller circuits. Software programs were written in C utilizing the Cairo graphics library"
- Ian
from Bookmarklet
"We've seen ZigBee wireless functionality showing up in everything from remote controls to robots, but apparently that was all just the beginning. The Alliance has announced plans to expand its low-power standards to support Internet Protocol, a move that member-company Texas Instruments is apparently quite pleased about -- perhaps seeing an opportunity to make up some of those declining sales in the mobile phone area. IP connectivity in all sorts of random devices should open the door for plenty of exciting and new-fangled connectivity options, all of which can only mean one thing: dung beetle MMO."
- Ian
from Bookmarklet