5 ms·

We're making visual feedback simpler.

33 points by brendanib 13y ago

destraynor 13y ago
Nice work guys, looks very useful
- brendanib 13y ago
  Thanks Des! It's come a long way since we showed you guys last month. Matt and I are very happy intercom users over here too :)
toddmorey 13y ago
I don't think I quite understand what Awesomebox is. Is it packaged staging server with built in commenting functionality? What type of code can be pushed to it? Why is it that you push code your way rather than install a widget of some kind in existing staging environments?
- brendanib 13y ago
  Think of Awesomebox like a versioned CDN - you can push any HTML, CSS or JS, and then invite anyone to view, comment and annotate it. It's different from a widget in that Awesomebox gives you infinite staging environments - if you push 10 different ideas, and then invite a few people, they can easily switch between different versions without you having to manage multiple servers. In our experience, this is really important when working through new ideas or designs with clients or managers. Does that help answer your question? Happy to explain more if not.
  - toddmorey 13y ago
    Got you. That does help a bit. I do think there is something interesting here. Today I spent time reviewing and commenting on the interface screens of an OpenID implementation currently in development. I wonder if there is some sort of proxy or browser extension you could employ to capture the HTML state of dynamically generated content. For us, this portion of the site never went through a static mockup phase.
    - brendanib 13y ago
      That's a great example - we're certainly thinking about how to balance the power of static assets, which let us display a few different versions, versus supporting generated content from web servers like Rails or Django, where we can only display what's on your server. Really, really appreciate the feedback!
    - mmilo 13y ago
      This is pretty much what http://bugherd.com http://bugherd.com does. It has accompanying browser extensions that embed reporting functionality directly into a live website and automatically capture browser data and even screenshots when an issue is reported.
cwisecarver 13y ago
Your video is falling out of the laptop screen, to the right side, on an iPad air.
- brendanib 13y ago
  Thanks for the heads up! Working on a fix right now.
primigenus 13y ago
Very cool! This is very very similar to the feedback and annotation feature I'm working on for our product. There's a clear need for this capability to comment (and draw) directly on the design. It just makes it so much easier to talk about something when you literally talk around it. My inspiration for the feature was that feeling I always got that I needed to walk over to someone's desk and show them what I'm working on on my Macbook or paper and talk through it. Sometimes you can't do that if the team is remote or a client needs to check something out, so you need an approximation of that experience. Making a product around the feature is a great idea.
- brendanib 13y ago
  That's awesome! Totally agree about remote work - our inspiration came working with people across multiple timezones, and not always being able to walk over and show them. I'm curious - what's the name of the product you're building?
  - primigenus 13y ago
    It's Handcraft, a HTML prototyping app. Link is in my profile.
    - brendanib 13y ago
      Cool! I'll check it out.
__shurik__ 13y ago
Bro! I tried to sign up with Google and it looks like maybe just maybe your OAuth is broken! Dogfooding.
- mattinsler 13y ago
  You're absolutely right! We're so sorry about that! It's fixed now. Thanks for finding that!
mikelbring 13y ago
Looks like it does the exact same thing http://notableapp.com/ http://notableapp.com/ does.
- brendanib 13y ago
  Similar, but not quite - notable is focused on design prototyping and wireframing, but our goal with Awesomebox is to follow a website throughout its lifecycle, not just during the initial design phase. I'm a big fan of ZURB though - their products are great and I've enjoyed working with the Foundation CSS framework.
ithayer 13y ago
It took me awhile to get, but my aha moment was understanding its relationship to regular PaaS's (eg: heroku). What more could you do if you didn't need to deploy your entire stack with each little change you make? If you could only deploy your frontend (in different versions simultaneously) pointing to a backend that's always up, it enables much faster iteration: testing, bugfixing, demoing things that otherwise you might not deploy different versions for because it's too painful. For example, you could A/B test meaningful portions of frontend code in a more scalable way than, say, Optimizely. Or you might point a user that's having problems to a specific build (which you can deploy instantly) and see if it fixes their problem _on their live account_. Or you can hack together a new feature that works _on a live account_ for a presentation, and push it without worrying about mucking up or interrupting production traffic. Or turn off minification instantly and deploy that. Plus, you don't have to worry about refining internal frontend build scripts, it's plug and play.
coherentpony 13y ago
Here's some visual feedback: Application Error An error occurred in the application and your page could not be served. Please try again in a few moments. If you are the application owner, check your logs for details.
- brendanib 13y ago
  Sorry! We hit some momentary downtime on Heroku. Back online now.
  - coherentpony 13y ago
    Thanks :)
rafifyalda 13y ago
Why are you guys working past 1am? Get some sleep, feedback can wait in the morning!
mbrzuzy 13y ago
Looks like it's similar to, if not the same as www.designdrop.io.
- brendanib 13y ago
  Not quite - Awesomebox works with your real production code, whereas DesignDrop is only for design files like PNGs, JPEGS and PSDs.
taitems 13y ago
After using http://bugherd.com http://bugherd.com for a while, I find this uncomfortably close. The icon-based side nav, the drag selection, the overall colours and theming. I'm not making any accusations, but I think it needs to be said that it's the first thing I thought of.
- toast76 13y ago
  I appreciate the sentiment, but I do think it's quite a bit different to what we at BugHerd do. BugHerd is designed to run ON your site, rather than your site running IN BugHerd. We originally went down the awesomebox path, but as soon as we started dealing with server side code it caused issues. We run on your production/staging environment meaning you get your app running in the wild.
- brendanib 13y ago
  Hey, Brendan from Awesomebox here - I've actually never used Bugherd before (though I've heard great things!), so I don't know what it looks like enough to copy. As toast76 says, we also do very different things.
rschmitty 13y ago
What kind of pricing structure are you looking at? Also Windows/FF gets an invalid font character for the "v" arrow on the grey tab. Works ok in Chrome/IE More once inside the app: http://i.imgur.com/WFaLbjw.jpg http://i.imgur.com/WFaLbjw.jpg
- brendanib 13y ago
  Sorry about that! Offhand I think that's a unicode issue that I need to fix. Thank you for the heads up. Will work on a fix tonight. As far as pricing, we're not sure yet, but we want to make it as free and accessible to developers and designers as we can, and charge companies, not people - kind of like how Github is free for open-source projects.
  - mmmooo 13y ago
    firefox doesn't allow cross domain fonts w/o allow-origin
ultimatedelman 13y ago
Tried to install, got an error, looked at the stack trace and saw this: at module.exports (C:\[snip]\npm\node_modules\awesomebox\node_modules\awesomebox-core\__trojan__\horse.js:15:10) What. The. Fuck. Could not possibly uninstall fast enough. Running antivirus ASAP
- mattinsler 13y ago
  I promise this isn't a trojan horse! Trojan is actually an npm module that allows you to compile down nodejs code so that you can package it all as a single downloadable. Check out trojan here: https://github.com/mattinsler/trojan https://github.com/mattinsler/trojan This helps with managing download times for all the transpiling code that we use for things like coffeescript and less and ejs. At the time I wrote this module I thought it'd be funny to name one of the files horse to continue the joke. Definitely time to change that filename. =-) I'd be happy to walk you through how all the code works if you're interested.
  - teh_klev 13y ago
    Matt, you have two problems here I think you need to fix: 1. Your "trojan horse" name for that packager - has two connotations for me, neither of them good. Why not just call it what it is. 2. Your product name. I really couldn't recommend your product to anyone doing serious work for my company or my clients. The whole "awesome" and "ninja" vocabulary thing is grating, is done to death, I am sick of hearing it. My advice is to pick a better name if you want to attract anything more than tyre kickers. Pretty sure you put a lot of time an effort into this, don't blow it with stuff like this.
- vbrendel 13y ago
  You should never have run "Trojan Horse.exe"
- mattinsler 13y ago
  Also, all of the code for Awesomebox is completely open source. Please check it out if you'd like. The CLI client is here: https://github.com/awesomebox/awesomebox https://github.com/awesomebox/awesomebox The rendering core is here: https://github.com/awesomebox/awesomebox-core https://github.com/awesomebox/awesomebox-core Also, lots of the modules used in both the CLI and backend of the product are available here: https://github.com/mattinsler?tab=repositories https://github.com/mattinsler?tab=repositories

33 points by brendanib 13y ago

destraynor 13y ago

Nice work guys, looks very useful

brendanib 13y ago
Thanks Des! It's come a long way since we showed you guys last month. Matt and I are very happy intercom users over here too :)

toddmorey 13y ago

I don't think I quite understand what Awesomebox is. Is it packaged staging server with built in commenting functionality? What type of code can be pushed to it? Why is it that you push code your way rather than install a widget of some kind in existing staging environments?

brendanib 13y ago
Think of Awesomebox like a versioned CDN - you can push any HTML, CSS or JS, and then invite anyone to view, comment and annotate it. It's different from a widget in that Awesomebox gives you infinite staging environments - if you push 10 different ideas, and then invite a few people, they can easily switch between different versions without you having to manage multiple servers. In our experience, this is really important when working through new ideas or designs with clients or managers. Does that help answer your question? Happy to explain more if not.
- toddmorey 13y ago
  Got you. That does help a bit. I do think there is something interesting here. Today I spent time reviewing and commenting on the interface screens of an OpenID implementation currently in development. I wonder if there is some sort of proxy or browser extension you could employ to capture the HTML state of dynamically generated content. For us, this portion of the site never went through a static mockup phase.
  - brendanib 13y ago
    That's a great example - we're certainly thinking about how to balance the power of static assets, which let us display a few different versions, versus supporting generated content from web servers like Rails or Django, where we can only display what's on your server. Really, really appreciate the feedback!
  - mmilo 13y ago
    This is pretty much what http://bugherd.com http://bugherd.com does. It has accompanying browser extensions that embed reporting functionality directly into a live website and automatically capture browser data and even screenshots when an issue is reported.

cwisecarver 13y ago

Your video is falling out of the laptop screen, to the right side, on an iPad air.

brendanib 13y ago
Thanks for the heads up! Working on a fix right now.

primigenus 13y ago

Very cool! This is very very similar to the feedback and annotation feature I'm working on for our product. There's a clear need for this capability to comment (and draw) directly on the design. It just makes it so much easier to talk about something when you literally talk around it. My inspiration for the feature was that feeling I always got that I needed to walk over to someone's desk and show them what I'm working on on my Macbook or paper and talk through it. Sometimes you can't do that if the team is remote or a client needs to check something out, so you need an approximation of that experience. Making a product around the feature is a great idea.

brendanib 13y ago
That's awesome! Totally agree about remote work - our inspiration came working with people across multiple timezones, and not always being able to walk over and show them. I'm curious - what's the name of the product you're building?
- primigenus 13y ago
  It's Handcraft, a HTML prototyping app. Link is in my profile.
  - brendanib 13y ago
    Cool! I'll check it out.

__shurik__ 13y ago

Bro! I tried to sign up with Google and it looks like maybe just maybe your OAuth is broken! Dogfooding.

mattinsler 13y ago
You're absolutely right! We're so sorry about that! It's fixed now. Thanks for finding that!

mikelbring 13y ago

Looks like it does the exact same thing http://notableapp.com/ http://notableapp.com/ does.

brendanib 13y ago
Similar, but not quite - notable is focused on design prototyping and wireframing, but our goal with Awesomebox is to follow a website throughout its lifecycle, not just during the initial design phase. I'm a big fan of ZURB though - their products are great and I've enjoyed working with the Foundation CSS framework.

ithayer 13y ago

It took me awhile to get, but my aha moment was understanding its relationship to regular PaaS's (eg: heroku). What more could you do if you didn't need to deploy your entire stack with each little change you make? If you could only deploy your frontend (in different versions simultaneously) pointing to a backend that's always up, it enables much faster iteration: testing, bugfixing, demoing things that otherwise you might not deploy different versions for because it's too painful. For example, you could A/B test meaningful portions of frontend code in a more scalable way than, say, Optimizely. Or you might point a user that's having problems to a specific build (which you can deploy instantly) and see if it fixes their problem _on their live account_. Or you can hack together a new feature that works _on a live account_ for a presentation, and push it without worrying about mucking up or interrupting production traffic. Or turn off minification instantly and deploy that. Plus, you don't have to worry about refining internal frontend build scripts, it's plug and play.

coherentpony 13y ago

Here's some visual feedback: Application Error An error occurred in the application and your page could not be served. Please try again in a few moments. If you are the application owner, check your logs for details.

brendanib 13y ago
Sorry! We hit some momentary downtime on Heroku. Back online now.
- coherentpony 13y ago
  Thanks :)

rafifyalda 13y ago

Why are you guys working past 1am? Get some sleep, feedback can wait in the morning!

mbrzuzy 13y ago

Looks like it's similar to, if not the same as www.designdrop.io.

brendanib 13y ago
Not quite - Awesomebox works with your real production code, whereas DesignDrop is only for design files like PNGs, JPEGS and PSDs.

taitems 13y ago

After using http://bugherd.com http://bugherd.com for a while, I find this uncomfortably close. The icon-based side nav, the drag selection, the overall colours and theming. I'm not making any accusations, but I think it needs to be said that it's the first thing I thought of.

toast76 13y ago
I appreciate the sentiment, but I do think it's quite a bit different to what we at BugHerd do. BugHerd is designed to run ON your site, rather than your site running IN BugHerd. We originally went down the awesomebox path, but as soon as we started dealing with server side code it caused issues. We run on your production/staging environment meaning you get your app running in the wild.
brendanib 13y ago
Hey, Brendan from Awesomebox here - I've actually never used Bugherd before (though I've heard great things!), so I don't know what it looks like enough to copy. As toast76 says, we also do very different things.

rschmitty 13y ago

What kind of pricing structure are you looking at? Also Windows/FF gets an invalid font character for the "v" arrow on the grey tab. Works ok in Chrome/IE More once inside the app: http://i.imgur.com/WFaLbjw.jpg http://i.imgur.com/WFaLbjw.jpg

brendanib 13y ago
Sorry about that! Offhand I think that's a unicode issue that I need to fix. Thank you for the heads up. Will work on a fix tonight. As far as pricing, we're not sure yet, but we want to make it as free and accessible to developers and designers as we can, and charge companies, not people - kind of like how Github is free for open-source projects.
- mmmooo 13y ago
  firefox doesn't allow cross domain fonts w/o allow-origin

ultimatedelman 13y ago

Tried to install, got an error, looked at the stack trace and saw this: at module.exports (C:\[snip]\npm\node_modules\awesomebox\node_modules\awesomebox-core\__trojan__\horse.js:15:10) What. The. Fuck. Could not possibly uninstall fast enough. Running antivirus ASAP

mattinsler 13y ago
I promise this isn't a trojan horse! Trojan is actually an npm module that allows you to compile down nodejs code so that you can package it all as a single downloadable. Check out trojan here: https://github.com/mattinsler/trojan https://github.com/mattinsler/trojan This helps with managing download times for all the transpiling code that we use for things like coffeescript and less and ejs. At the time I wrote this module I thought it'd be funny to name one of the files horse to continue the joke. Definitely time to change that filename. =-) I'd be happy to walk you through how all the code works if you're interested.
- teh_klev 13y ago
  Matt, you have two problems here I think you need to fix: 1. Your "trojan horse" name for that packager - has two connotations for me, neither of them good. Why not just call it what it is. 2. Your product name. I really couldn't recommend your product to anyone doing serious work for my company or my clients. The whole "awesome" and "ninja" vocabulary thing is grating, is done to death, I am sick of hearing it. My advice is to pick a better name if you want to attract anything more than tyre kickers. Pretty sure you put a lot of time an effort into this, don't blow it with stuff like this.
vbrendel 13y ago
You should never have run "Trojan Horse.exe"
mattinsler 13y ago
Also, all of the code for Awesomebox is completely open source. Please check it out if you'd like. The CLI client is here: https://github.com/awesomebox/awesomebox https://github.com/awesomebox/awesomebox The rendering core is here: https://github.com/awesomebox/awesomebox-core https://github.com/awesomebox/awesomebox-core Also, lots of the modules used in both the CLI and backend of the product are available here: https://github.com/mattinsler?tab=repositories https://github.com/mattinsler?tab=repositories