3 ms·

> did you consider using colors I did consider it, but I never experimented with it. For a small number of qubits, I think oriented circles are much clearer. T

> did you consider using colors I did consider it, but I never experimented with it. For a small number of qubits, I think oriented circles are much clearer. Then they get gradually worse as you move up towards 16 qubits. Once the amplitudes get close to pixel-sized, you're probably forced to use color if you want to show a decent 1-to-1 representation. Some of the downsides: - Color-blind unfriendly. - Worse absolute accuracy at a glance. I can guess the absolute angle of a short line to within a couple degrees (~100 distinguishable buckets). For hues that's probably more like 20-30 buckets, though relative comparisons would still be ~100 buckets accurate. The angular velocity at a glance probably also suffers. - Circular motion, where the center is not at 0 (e.g. watch the X^t gate), won't look quite so circular. - I already use color to hint at meaning (green is densities/probabilities, blue is amplitudes, yellow is volatility). > is there some slider, so I can lookup state at any stage (not only the last one)? Drag an amplitude display (the green 'Amps' thing in the toolbox) onto the circuit. Put it where you want to see the state. Resize it to cover everything. (At the moment the inline displays are limited to covering 8 qubits. I was worried about performance when they get large. It'll be fixed in the future.) Edit: Gah, there's a bug where the amplitude display is showing 'NaN' unless all the covered qubits are not entirely Off. Not sure how that slipped in. Edit #2: Oh, it's happening on my work machine but not on my home machine. So probably related to webgl being terrible.

bmer 10y ago
I am a newb dev, so I am curious to know what you used to build the simulator. You name-dropped webgl, but what else is needed to put together something like this, with the nice drop down menus, the drag and drop, and all that?
- Strilanc 10y ago
  The drag-and-drop is done from scratch. Quirk just listens to browser events like mousedown/mousemove/mouseup and turns that into manipulations of the circuit. Getting it to work well across all the browsers, and modes of interactions, is quite finicky. For example, mobile browsers refused to not scroll even if `event.preventDefault()` was called, so I had to overlay the drag targets with transparent divs that have `touch-action: none`. Quirk doesn't have menus.. you might be thinking of the recording of Davy's simulator? Those menus also look custom-made. I actually wouldn't call them "nice", because they lack important polish. Read this: http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown http://bjk5.com/post/44698559168/breaking-down-amazons-mega-... I'm sure there are libraries for menus and things like that, but I generally prefer to try to do it myself unless those libraries have a really good interface.
  - wybiral 10y ago
    > I actually wouldn't call them "nice" You're being polite... Those drop downs are hideous!
Agentlien 10y ago
I'd like to second the color blindness concern. As someone with a color vision deficiency (deuteranopia, commonly known as red-green color blindness), I can't even enumerate the times I've been unable to complete some task because of a color coding which I couldn't distinguish. Worse yet, it often takes me a long time of trying to figure out how I'm supposed to know something before I suddenly stop and go "Oh, this might be color coded." In high school, whenever I felt that I suddenly couldn't follow some explanation on the whiteboard, that's when I knew the drawings were color coded. The fact that things were color coded was usually communicated implicitly. Often, this is done by drawing two sets of things in different colors, usually red and green, and then just pointing at one instance from each category while giving some explanation regarding that category. This is simple, possibly not even a conscious choice, and it works perfectly as long as the students have the slightest bit of logical reasoning skills... and can actually tell that there are multiple colors being used.
stared 10y ago
Fair points with colors. While I still see some of their advantages (e.g. see there: http://imgur.com/esAxcEL http://imgur.com/esAxcEL) - thank you for brining me their downsides. (Also, very likely I will use "clocks" as an alternative vis for my own projects!) However, one thing that I think could be better for clocks is that when probability is small, then it phase is less important (I know the circle; but maybe opacity changing with log-probability?). For measurement in between - the things that are there are interesting. But I was thinking about some mouseover - when you get full plot (intensity, phases), as something built-in. For not time-dependent circuits it would be cool to lookup step-by step. In any case, this time-dependent operators is a thing beyond-expectations, so special thanks for that!

bmer 10y ago

I am a newb dev, so I am curious to know what you used to build the simulator. You name-dropped webgl, but what else is needed to put together something like this, with the nice drop down menus, the drag and drop, and all that?

Strilanc 10y ago
The drag-and-drop is done from scratch. Quirk just listens to browser events like mousedown/mousemove/mouseup and turns that into manipulations of the circuit. Getting it to work well across all the browsers, and modes of interactions, is quite finicky. For example, mobile browsers refused to not scroll even if `event.preventDefault()` was called, so I had to overlay the drag targets with transparent divs that have `touch-action: none`. Quirk doesn't have menus.. you might be thinking of the recording of Davy's simulator? Those menus also look custom-made. I actually wouldn't call them "nice", because they lack important polish. Read this: http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown http://bjk5.com/post/44698559168/breaking-down-amazons-mega-... I'm sure there are libraries for menus and things like that, but I generally prefer to try to do it myself unless those libraries have a really good interface.
- wybiral 10y ago
  > I actually wouldn't call them "nice" You're being polite... Those drop downs are hideous!

Agentlien 10y ago

I'd like to second the color blindness concern. As someone with a color vision deficiency (deuteranopia, commonly known as red-green color blindness), I can't even enumerate the times I've been unable to complete some task because of a color coding which I couldn't distinguish. Worse yet, it often takes me a long time of trying to figure out how I'm supposed to know something before I suddenly stop and go "Oh, this might be color coded." In high school, whenever I felt that I suddenly couldn't follow some explanation on the whiteboard, that's when I knew the drawings were color coded. The fact that things were color coded was usually communicated implicitly. Often, this is done by drawing two sets of things in different colors, usually red and green, and then just pointing at one instance from each category while giving some explanation regarding that category. This is simple, possibly not even a conscious choice, and it works perfectly as long as the students have the slightest bit of logical reasoning skills... and can actually tell that there are multiple colors being used.

stared 10y ago

Fair points with colors. While I still see some of their advantages (e.g. see there: http://imgur.com/esAxcEL http://imgur.com/esAxcEL) - thank you for brining me their downsides. (Also, very likely I will use "clocks" as an alternative vis for my own projects!) However, one thing that I think could be better for clocks is that when probability is small, then it phase is less important (I know the circle; but maybe opacity changing with log-probability?). For measurement in between - the things that are there are interesting. But I was thinking about some mouseover - when you get full plot (intensity, phases), as something built-in. For not time-dependent circuits it would be cool to lookup step-by step. In any case, this time-dependent operators is a thing beyond-expectations, so special thanks for that!