Atomic – Design, prototyping and collaboration tool(atomic.io)
atomic.io
Atomic – Design, prototyping and collaboration tool
https://atomic.io
32 comments
How are you different from http://Webflow.com ?
It looks like Atomic is purely for prototyping/mockups; Webflow is for building actual websites. The interface certainly does look similar though.
A few suggestions now that I've had a chance to play with it:
* Support for rulers * Custom zoom - or at least more granularity between 50 and 100 * Ability to align a div to the center or right * Related to the above - it appears that adding alignment css does nothing * FontAwesome
* Support for rulers * Custom zoom - or at least more granularity between 50 and 100 * Ability to align a div to the center or right * Related to the above - it appears that adding alignment css does nothing * FontAwesome
Thanks heaps for the suggestions, I've add your vote to these features in the list we maintain internally.
Today we’re launching our open beta, so anyone can set up an account and start prototyping straight away.
Atomic makes it easy to share your designs and prototypes and gather feedback. From today you can also invite teammates into your projects to work together on the same set of designs, simultaneously.
If you don’t have an account already, you can grab a free account here: https://atomic.io
We’d love to hear what you think.
Atomic makes it easy to share your designs and prototypes and gather feedback. From today you can also invite teammates into your projects to work together on the same set of designs, simultaneously.
If you don’t have an account already, you can grab a free account here: https://atomic.io
We’d love to hear what you think.
I'm no designer, but this looks great nontheless! Good job.
One thing I noted while reading on here was that currently, non-chrome users are "blocked" (if I understood correctly) by a "not supported" message. I understand you want to focus on Chrome first, but why don't you simply put up that message as "Your browser is unsupported, atomic.io might not function properly" (or a banner on top of the page), but make it available nonetheless? It might not work 100% yet, but when working on cross-browser support you will already have a bunch of people who tested your software on their browsers. These will know the rough edges and can point you into the right direction.
If it's open to every browser I'm sorry I missunderstood this thread. Nevermind my post then.
One thing I noted while reading on here was that currently, non-chrome users are "blocked" (if I understood correctly) by a "not supported" message. I understand you want to focus on Chrome first, but why don't you simply put up that message as "Your browser is unsupported, atomic.io might not function properly" (or a banner on top of the page), but make it available nonetheless? It might not work 100% yet, but when working on cross-browser support you will already have a bunch of people who tested your software on their browsers. These will know the rough edges and can point you into the right direction.
If it's open to every browser I'm sorry I missunderstood this thread. Nevermind my post then.
Hi, you're right that it's restricted to Chrome-only for now. We have tested it in other browsers and there are in some cases issues that would lead to a poor experience - not the sort of experience we want people to have. I do appreciated your suggestion of opening it up anyway though, and as we get closer to fully supporting other browsers this may be exactly what we do. Cheers.
I logged in and got a "Browser not supported" message on my up-to-date version of Safari. What happened to the open web?
Just because this beta software doesn't support your browser doesn't mean the open web is dead.
Hi, while we're in beta we've been keeping things to Chrome only, as it lets us progress the product faster at this early stage. We're also big believers in the open web and will be looking to offer wider browser support down the track, so stay tuned!
So I'm actually looking around for a similar product; what's the difference with Atomic and Invision? It kinda looks like Atomic is Invision Lite but then again Invision has probably been around a lot longer so maybe it's not a fair comparison.
It would be pretty cool if I could immediately jump in and try it out without setting up an account. I understand most places don't do that but it's kinda nice being able to try something before giving away your email address. In my opinion anyway.
It would be pretty cool if I could immediately jump in and try it out without setting up an account. I understand most places don't do that but it's kinda nice being able to try something before giving away your email address. In my opinion anyway.
Hi, I think there's actually quite a lot of differences between Atomic and InVision, so I'll focus on what I think the main reasons are that you might try Atomic if you're already familiar with InVision...
Atomic has drawing tools that let you actually design/layout interfaces in the app. You can also import flat images from other apps (like PS or Sketch) for prototyping if you want to. Atomic also lets you design complex and unique animated transitions, not just the standard ones on mobile.
Atomic has some other special features too: like being able to style elements with raw CSS, visually rewind through your history and make branches/variations from any point, and team collaboration that lets multiple team members work on the same set of designs, even simultaneously.
So lots of reasons to give it a try I think. I hope you give it a go and please do let us know what you think.
Atomic has drawing tools that let you actually design/layout interfaces in the app. You can also import flat images from other apps (like PS or Sketch) for prototyping if you want to. Atomic also lets you design complex and unique animated transitions, not just the standard ones on mobile.
Atomic has some other special features too: like being able to style elements with raw CSS, visually rewind through your history and make branches/variations from any point, and team collaboration that lets multiple team members work on the same set of designs, even simultaneously.
So lots of reasons to give it a try I think. I hope you give it a go and please do let us know what you think.
Looks nice. I'd also be curious to know the main differences between this and proto.io...
Lots of differences I think. Probably the main one is that Atomic's workspace will feel more familiar to those used to Adobe apps or Sketch. I think it'd be fair to say proto.io focusses more purely on prototyping, while Atomic tries to integrate design, prototyping, collaboration and version control tools.
Thanks; I'll probably take a look at it over the weekend.
The history scrubber (scroll back through time and see all the decision ideas that were tried out and abandoned) is genius.
I've had this idea for quite a while for git visualisation tool where you open a project and can open a file and scrub through the timeline and see the changes live.
The fact that this idea is better suited inside an actual code editor (and not just a standalone app) and me not being brave enough to tackle writing a code editor is what is stopping me from doing it.
The fact that this idea is better suited inside an actual code editor (and not just a standalone app) and me not being brave enough to tackle writing a code editor is what is stopping me from doing it.
Glad you like it!
We've been using this tool for a while in beta and the biggest win I can say is having an online tool that works. So many of the other tools out there have issues when you drag and drop too fast, move your cursor over the wrong part of the interface, copy and paste too quickly - but the guys at Atomic have spent a heap of time making this feel like an installed app.
Other features aside, this is the winner for me.
Other features aside, this is the winner for me.
What is the reason for requiring only Chrome browsers?
Hi, while we're in beta we've been keeping things to Chrome only, as it lets us progress the product faster at this early stage. Specifically, this cuts out a lot of time spent on cross-browser testing and bug fixing and lets us focus on making sure we've got the right mix of features first.
It's the first time I've tried this approach myself, so it's a bit of an experiment, but I think it's been useful for this particular product. In saying that, we will be looking to offer wider browser support down the track, so stay tuned!
It's the first time I've tried this approach myself, so it's a bit of an experiment, but I think it's been useful for this particular product. In saying that, we will be looking to offer wider browser support down the track, so stay tuned!
The history slider looks awesome. It's great to see new design apps with features that take advantage of the strengths of browser-based applications for creative collaboration, rather than just trying to replicate desktop usage models.
I'm using Safari so I didn't get to actually use the tool yet (it's Chrome only)... Looking forward to it though.
I'm using Safari so I didn't get to actually use the tool yet (it's Chrome only)... Looking forward to it though.
I am mystified. Probably something is not working correctly.
The Pages show various previews. Clicking on them does not open that page in the right side (as I would expect). Its blank.
I can create rectangles, lines, hotspots and move them around. Hotspots doesn't have any way to make them do anything that I can figure out. No ctrl-click, no options. Its just a blue square.
I click on Layers. Lots of things here. The things I created and lots of things I didn't (and can't see) like History, number circle, hotspot-demo2.gif. I can drag them up and down in the Layers or I can drag them into the main area but they don't do anything.
Why would History be in there ? Properties Prototype Tools ? I can double click and retitle those objects. I have no idea what they are.
Obviously something is broken.
OK, I've opened the Keyboard shortcuts and at the very bottom it says ⌘ + enter: toggle review mode.
With that I can actually see the design.
Suggestion: you probably want a very obvious button at the top to allow us to toggle "review mode"
The Pages show various previews. Clicking on them does not open that page in the right side (as I would expect). Its blank.
I can create rectangles, lines, hotspots and move them around. Hotspots doesn't have any way to make them do anything that I can figure out. No ctrl-click, no options. Its just a blue square.
I click on Layers. Lots of things here. The things I created and lots of things I didn't (and can't see) like History, number circle, hotspot-demo2.gif. I can drag them up and down in the Layers or I can drag them into the main area but they don't do anything.
Why would History be in there ? Properties Prototype Tools ? I can double click and retitle those objects. I have no idea what they are.
Obviously something is broken.
OK, I've opened the Keyboard shortcuts and at the very bottom it says ⌘ + enter: toggle review mode.
With that I can actually see the design.
Suggestion: you probably want a very obvious button at the top to allow us to toggle "review mode"
Hi, what version of Chrome are you using? We've has users experiencing similar issue on Chrome Dev/Canary which we're looking into, so you might want to try Chrome Stable.
Version 44.0.2403.9 dev (64-bit)
Do you know what's not a beautiful interaction? Scrolling 40px on the website and wondering if your machine froze because it's this "cards scrolling over things" UI concept... Designers, don't make me doubt my scroll.
Good point! We'll try to fix that.
Prototyping tools seem to be blooming this year (see pencilcase.io and pixate.com), and it'll be great to see them mature over the next few years.
Confused you with Atomic Object[0] at first, although they aren't exactly in the same field as you.
[0]: https://atomicobject.com/
[0]: https://atomicobject.com/
Allll right. Another atom-named project. Check.
http://www.projectatomic.io/
https://atomicobject.com/
https://atomicorp.com/
https://atom.io/
http://tools.ietf.org/html/rfc5023 (Atom Publishing Protocol)
(yeah, I know, look who knows how to google)
http://www.projectatomic.io/
https://atomicobject.com/
https://atomicorp.com/
https://atom.io/
http://tools.ietf.org/html/rfc5023 (Atom Publishing Protocol)
(yeah, I know, look who knows how to google)