Hacker News new | comments | show | ask | jobs | submit login
A circuit and PCB editor in the browser (circuits.io)
201 points by skbohra123 on Oct 11, 2012 | hide | past | web | favorite | 81 comments

I am not a hardware guy. Other than playing with n-in-one electronics kits as a kid I haven't ever touched it much. I recently needed to build a "sensor pod" (my name) for my ongoing 6-camera high altitude balloon project. I got everything working on a breadboard and needed to move it to a more permanent PCB. Enter Fritzing[0].

I fell in love with Fritzing pretty quickly. It has 3 mode. Breadboard, schematic, PCB. I was able to copy my physical breadboard layout over to the virtual one. From that, it basically gave me a schematic (what I wanted) and a PCB layout (not entirely useful for me). I had to touch up the routing and fix some lines that wanted to connect VCC straight to GND. I was able to figure it out pretty readily and fix it all and now have a working PCB[1].

All this is to say, if you're a noob, Fritzing is great. This (circuits.io) is probably geared at non-noobs, and I'm sure it's fine for them. I am not quite able to jump right into drawing a schematic, though. As such, I can't provide much of an opinion on it. :)

[0] http://fritzing.org/

[1] http://goo.gl/iWuZF

I would love to ditch Eagle PCB for a tool like this. Eagle is awesome, but as a hobbyist I don't use 70% of its features. From a quick look at circuits.io here's what I would want in order to make the switch:

1) Let me import my Eagle components 2) Give me more control over grid sizing 3) Autorouter!

I'm also interested in seeing the fabrication prices. Right now I use batchpcb.com (a Sparkfun service). There really aren't any other good options for printing a single PCB.

We are currently working hard at integrating with the octopart api. We aim at building a huge crowd sourced component lib, so you will never have to enter components again.

Grid and measurements are definitely on top of the list.

Autorouter is a bit lower, but want that. We will probably first do some form of assisted routing.

At this point you can download your gerber files and send them to a manufacturer of your choice, but we are working on integrating with services like BatchPCB.

Assisted routing would be way more useful (and probably easier to implement) than autorouting. Also, it would be great to have a versioning system that could pull together the good bits from different attempts at routing.

I've never found autorouters to be all that useful. I've always found their results awkward at best.

I also find routing by hand to be sort of relaxing.

Check out Advanced Circuits, they have a barebones PCB service that isn't too expensive for ordering test boards and one-offs. Turnaround is one day plus shipping. And they send you popcorn with your order for some reason.


OSH Park (formerly known as Laen's DorkbotPDX group PCB order) is very popular for prototypes in the US maker community (look for the trademark purple PCBs), and at $5/inch^2 with free US shipping it's cheaper than batchPCB for smaller boards, in addition to getting 3 copies of the board for that price. It's very high quality and it's all done at a US fab house with the 2-layer batches sent out every 2-3 days and then shipped US Mail, so if you're in the US it's pretty fast for the price.

And for pure price, Seeed and ITead (both are rumoured to use the same PCB fab) are very popular with their $10 for 10 copies of a 5cm*5cm board service. The quality is reportedly much more variable with these guys, and the shipping takes a lot longer to reach the US, but you can't beat the price. For the rest of the world, the shipping from China is probably cheaper and faster than from OSH Park, so unless you need the quality of OSH Park this is probably both cheaper and faster.

I second the recommendation, I've been using lean's service for a rather long time (I've go boards from back before he worked out the right purple color) and I've always been happy with the speed and quality, it's a great service.

I've always used the Basic service from http://www.apcircuits.com/ for my one-offs. It's pretty cheap and quick.

I second AP Circuits. I've been using them for prototypes for about 5 years now and am very happy with their work.

> Aren't any other good options for printing a single PCB

Bay Area Circuits, free layout tools & plenty of short run cheap boards starting at $30 (!) and up: http://bayareacircuits.com

Along those lines, do people here have any recommendations for fabrication? PCB manufacture is great, but I'm also looking for small-run SMT/assembly.

I had a board assembled recently ( https://0xfb.com/shop.html ) by bittele ( http://www.bittele.com/ ) and was very happy with the result and the process. In the US, there is screamingcircuits as well, they have faster turnaround if all your parts are sourced from the US, but cost more.

Thanks, that's exactly the sort of thing I had in mind! Your 3d printer uC looks pretty cool too!

Fritzing for really simple stuff.

DipTrace for most other things.

What's the difference/how is it positioned compared to Upverter (http://upverter.com)?

We have PCB layout (with Gerber export, which actually passes all BatchPCB or Eurocircuit DRC checks) and allow other circuits to be included as modules. I think this is a major difference as you can actually design something and have it fabricated. And the modular design flow allows you to "stand on the shoulders of giants". With the right modules, you don't need to be an expert anymore to design electronics.

Upverter has a nicer schematic editor and more social features, but doesn't have any PCB layout capabilities (at this time, at least.)

Looks awesome!

I have a quick question about PCB layout. In the video, when you switch from the schematic to the PCB layout view, there are thin lines which are clicked to become red. There is a final line that is clicked to become blue. Can you explain what is going on there?

FYI: I'm a CS person who is learning about electronics and circuits. I started building radio and op-amp circuits, and have read that prototyping on breadboard doesn't work well. I tried going from schematic to directly soldering on a perf board and it ended in disaster. This tool seems exactly what I need ... though I could use it to figure out my perf board layout.

That's changing the layer of the trace, from top to bottom. Note the vias (circular elements in the design) where the color transition occurs.

To the OP: Looks great! I like the approach for modules, I've often wished Eagle had an easier way to achieve this =) A question though, it looks like there's only one ground source allowed? Or, can those properties be changed? I prefer to separate AGND from GND when I have both analog and digital interfaces to the outside world.

At this point there is indeed only one ground label, but if you use the generic label you can create as many as you like. Nets in the schematic that are connected to labels with the same name are merged when switching to PCB.

It looks like these are two layer boards, meaning you can route traces either on the top (red line) or the bottom (blue line) of the board.

have read that prototyping on breadboard doesn't work well.

That's definitely not my experience. Using a solderless breadboard may add more noise, but it's much easier to assemble and correct mistakes.

> Using a solderless breadboard may add more noise, but it's much easier to assemble and correct mistakes.

Noise isn't usually the major problem with breadboards, though it is an issue. The much more troubling issue and what makes breadboards useless for a large number of circuits are the parasitics from the connections. The stray capacitance and inductance can cause large problems and even outright oscillation of even relatively low frequency circuits.

Good point, thanks for the correction. I recalled assembling RF and other analog circuits using breadboards in labs, but those were likely too low frequency to run into those problems.

This is the circuit I was trying to build (http://www.lucidscience.com/pro-basic%20spy%20transmitter-5....). I've always managed to breadboard circuits of this size without an issue so I just jumped into soldering components onto the PCB. It was a total disaster and took my confidence down a few notches :(

I must say, going from a novice who can make LEDs blink or hook together a few ICs to op-amps and RF circuits is turning out to be a big jump! If anyone has tips, those would be much appreciated.

My tip to you would be to start fixing broken electronics, preferably stuff from the 80's (people will throw those away so you can get them pretty much for free). The parts are cheap and the circuits are usually fairly easy to follow because most or all of it will be discrete components.

You will learn a ton from this and you'll gain good insight into how other circuits work. This is the hardware guy equivalent of reading other peoples code.

It just depends on what you are prototyping. Some things will run no problem on a breadboard, some will give you no end of misery.

Complicated circuits, circuits with components only available in SMT packages, high-speed circuits, circuits sensitive to noise (sensors)- these are a few examples of devices you may wish to prototype on something other than breadboard.

Try breaking down your circuits into components/units that you can solder with leads to the next [breadboarded] component. For more critical bits it may not help all that much, but it will get you going in the right direction and make real life a little easier to Command-Z. Of course, if you're attempting something just beyond your current grasp then it can't hurt to try it first in the simulator :)

Blue vs red represent the top and bottom layers of the PCB. When the video switches from red to blue it is to prevent two different paths from overlapping.

Neat! Do you guys plan on adding a plugin api so people can write simulators and auto-routers and such?

Cool idea! Thats something we will look at in the future.

Imagine what kinds of tools you could write if you had a giant corpus of schematics and edit histories. "Find a path through the graph of existing parts to wire these parts together" would be one example.

I like the ambition of this, and it has the potential to grow into something both useful and cash flow positive. Having a community of open schematics and layouts will be wonderful.

Does the layout editor support design rule settings/verification--things like clearance around traces and vias, via diameter, etc.?

An awesome feature would be a way to pull up a datasheet for a part by clicking on it in either the schematic or layout views. When I work on a project, I usually keep a paper binder of datasheets for quick reference. Having everything one or two clicks away would be great.

Using the Octopart API to build a BOM broken down by best vendor, per-part, would be cool too.

It wasn't clear when I tried using the site: Will it give me gerber files I can send to a fab? What about a completed board rendering a la OSH Park[1]?

Any plans to support components/footprints/libraries/whatever you want to call them from KiCAD or Eagle? Orcad? Altium?

Any plans to hook up with a fab, and panelize orders to optimize for low cost boards?

1. http://oshpark.com/

Can you read our minds? :)

I'm now working hard at integrating with octopart and pulling up the datasheet for a part is already in there, but there is a lot more ...

Next thing on the list is DRC. We already have the algorithms in place, so its basically down to doing the visualization. You can expect that soon!

You can easily download your gerber files. Just click "make" and then "download".

We have plans to build the largest shared component library in the world. Soon!

We are also currently working on hooking up to a fab and panelizing is certainly part of that. We want you to order a board with one click and receive it in the mail just a few days later. And all that at a good price!



I really like the idea of circuits.io. Here some things i noticed during a short test. (Probably you already know all these things)

Some kind of an "Push Obstacle" Layout mode would be nice. (Move the obstacles when you try to lay down an wire) Or at least a "Walk around Obstacle".

Have an adjustable keymapping. (i prefere to have zoom on "A" + "D", pan on "W", start routing on "S" etc. )

I wasn't able to change the layer (| is Alt+7 for me which your app doesn't seem to recognize)

Add more layer and Polygons/Planes. (Our standart pcb has 4 Layers. GND, VCC, 2 times routing)

The device search is just lame.

It would be nice to be able to edit a project as a team. (Have a history of changes and who made this changes, add a possible to review the changes, etc.)


That sounds like the assisted routing we are working on. Now we are focusing on getting the parts search a lot better. It will be amazing and should be online in a few days.

To change the layer you have to push 'l'((l)ayer) not '|'. Sorry about that it must be the font we use. Thats a good idea to have a custom keymapping! We will look in to that.

We are also working hard at version control, visualization between commits and more social features,...

Thanks for the feedback!

This looks like a great start! I do a lot of electronics design. I've used ORCad, PADS, Altium, EAGLE, DIPtrace, and so on and have never really found a package I really love. I currently use EAGLE for capture and PCB design, and do simulations in a PSPICE package outside of Eagle. This is a crappy solution, but it's the best cost/performance/simplicity tradeoff I've been able to come up with.

What type of Library features are you expecting? That's a major pain point with Eagle (Libraries are crap). If you're able to nail-down the collaboration, libraries, and version control features I'd certainly be up for switching our team over.

Would love to provide further input if you guys are interested. Shoot me an email if so: stephen at stephenlake.ca

Tried it for a few minutes. What is missing and should only take a few minutes to add are generic dips, more generic headers and generic soics. Without I'm stranded before I even get to start as the component library are limited and there is no way to add on your own.

You can add you own components at the bottom of your dashboard. The process is currently still a bit tedious, but we will have a massively easier flow earlier next week. For this we will integrate with Octopart and have a large number of standard footprints.

Sounds great. I will try it a bit more. Subscribed to the mailing list. Hope this will be a sucssess for you. Btw. I think the number of parts you see when searching could be increased.

Not to trample on copyright or patent, but it's "visio-style" in-browser circuit drawing. And it's fast. This might not be good for designing your next motherboard, but it's great for hobbyists! I'm excited to try modeling an MCH430 on here.

Congrats on the project! It's really interesting to see electrical engineering tools using web and modern concepts instead of the usual the nasty-windows-only-IDE packaging.

Word up! ;)

As far as I can tell, this doesn't yet support floods/pours. I know the target market wouldn't use them at the get go, and they are somewhat tricky to implement, but an essential feature IMO.

However, I love the module concept! Perfect way to combine open source hardware designs together!

I totally agree! Floods are certainly on top of the list. You can expect them one of these days!

Floods would be great because it saves chemicals and time when doing single and double sided boards at home. (Don't have to etch away so much copper.)

If you are a student, you can get academic access to state of the art circuit design tools from Cadence Design http://www.cadence.com/support/university/pages/default.aspx

Can you still open your own designs when you stop being a student?

Absolutely fantastic! I'm having problems trying to fork a circuit, though (rails' something went wrong message of doom). But this is definetly something I would love to use and see working. Kudos!

Sorry that was a bug. It's fixed now.

I have just picked up electronics again after a hiatus, need to create some simple boards. Will try this. If it works and gets momentum,it will really be great!

E-gads that thing is as frustrating as any other PCB layout software. More-so than many. It's a shame because Good PCB layout software is so badly needed.

1. Ctrl-R, a common shortcut to rotate a component, it's like second nature. Unfortunately, it means something different in a browser. Argh.

2. Don't click "save" unless you mean it. Oops. You just lost your work.

Those were minor complaints, these are not.

3. Searching through the components. You must let us see what we're browsing through. You must also let us filter.

4. PCB - How do I scatter components? Or must I pluck them out one at a time?

5. No Test Point footprint! Why does nobody use test points?

6. I know someone already said grid, but, grid.

I know you like your nice clean simple no-clutter UI, but put the help text on the screen, in the margins or something. You can make it optional.

PS - what is "circuithub.com" building? Is it a competitor to what you guys are working on? Excited that we're seeing some development in this area.

I love this. Sadly, forking (without logging in) seems to throw up a rails error screen instead of prompting me to log in. Great work, though.

Thats fixed now. Thanks for the notice!

Good catch, fixing that now

any plans to get this in use by any high school or college courses? Could you create a Udacity/Coursera "EE 101" course that uses circuit.io?

Not at this point, but the app is free to use for everybody. :) We plan to create some interactive and "game like" tutorials in the future, which should make it fun and easy to learn to design PCBs.

Still primitive compared to this http://www.falstad.com/circuit/

Falstad is for simple simulation. Not PCB layout.

Kind of simplistic. I much prefer http://www.dz863.com/index.php

This is really the first version of the editor and we are working on several more features. But a big design goal for us is actually to make it as simple as possible to design electronics. We believe that a lot more people could be designing electronics if the tools were simpler and if you could easily build on existing electronics modules, just like what happens when building software. This is at the heart of circuits.io

Hi, I have only very basic knowledge of electronics but I was still very much impressed by your software. I cannot suggest improvements on the electronics side but being an online marketer, I wanted to give you some tips for marketing, in case you find them useful.

1) You need to make the final output embeddable, like slideshare, so that people who are creating schematics using your software are able to put it on their blogs and website

2) The embedded version can have a link back to your site, e.g. "Modify this circuit" or better "Run this circuit" so that you get backlinks and the visitors can interact and come to your site.

3) You are 100% correct with the "try it now" button, but instead of redirecting them to a signup page, try using a modal popup over the circuit. I'm sure you'll see a good increase in signups with a split test.

4) You can also create a shareable URL (like tinyurl) where even without signing up a person can send that URL to a friend or post it on twitter/facebook. This will get you even more traffic / backlinks.

Just a few things on the top of my mind.

I gotcha. It's a good start then. I'll definitely keep an eye on it. A couple suggestions: have an option to turn on a grid in the background. Also would be nice to be able to rotate components.

From the help button in the top right, it looks like you can rotate and flip the components. (To GP)It definitely wasn't the easiest to find, maybe have a tutorial video showing how you are doing some of the things like rotating and moving traces to the bottom layer in the main video? Looks pretty good so far though; I might give it a try later with a board I've made before.

[Edit] A grid would be killer too; great suggestion.

[Final Edit] Tooltips on the components/actions would help your goal of making electronic design simpler/easier to do.

  Selecting: Hold down shift and left click elements.
  Box select: Hold down shift and drag a box around the elements to be selected.
  Deselect All: Left click on the canvas.
  Move Element: Just drag it.
  Connect Terminals: Drag from schematic terminal to other  schematic terminal.
  Disconnect Terminal: Left click terminal. Click 'X' .
  Rotate Element: Select element and push 'r'.
  Remove Element: Select element and push 'del'.
  Flip Element Horizontally: Select element and push 'h'
  Flip Element Vertically: Select element and push 'v'

Thanks for the help!:) I totally agree that we need tutorials and videos. Sorry about that!

Definitely contact us if you have any trouble.

Nice constructive feedback from an anonymous account.

How about telling the guys what you'd like to see to improve the service ?

He gave a link and said he thought it was simplistic.

Comparing the linked product with the product in the article would be a good start. The fact that he/she is anonymous does not make this invalid feedback, just like the fact that you are anonymous yourself does not make your comments invalid.

Great project, runs very smoothly in the browser. What graphics library/API (javascript/html5) did you use to build it?

We use jQuery SVG for building the SVG and the lots of javascript to manipulate it.

As far as I can tell, they're just doing SVG manipulation with Javascript.

I don't see any common libraries being used, though.

I like to build guitar effects and this is awesome.


Awesome job, way to go Karel and co.


yay another "chrome only" site.

Whilst I sympathise, "Chrome only" is already more widely available than a Windows or OS X or Linux program would be. The world of electronics is full of software that only runs on Windows. Having to install a free cross-platform browser is already an improvement.

Yeah but that doesn't mean it'll stay that way forever. I'm personally for actual standards, so all browsers play by the same rule.

Not you must use company X's product, no matter how good it is. Because once they'll get 99% of the market, they'll trash it in the name of profit. It's inevitable.

That's why i don't like "chrome only".

Also works on Safari, on Firefox there are just some minor glitches. Just didn't have the time yet for thorough cross browser testing and tuning

Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact