2

I think this question goes more to all UI designers ;-)
I want to make a WPFelement that looks like a volume control knob on a hifi amplifier. To get a better expresion of what I am talking about take a look at this pic

Volume Control sample

I cut this out of the sw VirtualDJ.
The element should be turnable to left and right. When it is tured to the right the value should increase by 0.5f and by turning it to the left the value should decrese by 0.5f.

Why do I need such a thing? Currently I am working on a control sw for my Deneon AVR-4306 Amplifier and I was thinking that it would look pretty cool to use such a control to set the volume of the amplifier.

Cody Gray - on strike
  • 239,200
  • 50
  • 490
  • 574
Christoph
  • 438
  • 1
  • 6
  • 14
  • @Kev: Sorry but the question is HOW to implement such a control. See second sentence. Cody and Dmitry got it all right, so pls tell me where ur problem is with the post? – Christoph Feb 12 '12 at 16:21
  • Ok, but that's not in the question, you just stated some things. Also you haven't told us what you tried or what you think might work. You just stated a requirement for a control and appear to expect the community to produce a solution. We expect a wee bit of effort on your part first. – Kev Feb 12 '12 at 16:57
  • @Kev: Ok, thanks for the support. Your right, I was thinking of how to build such a control but come up with no idea, so I thought I just ask the community if someone had done anything like this before. As seen in my command on the first answer I don't wannt to start a discussion here. I was just hoping that someone might have a clue or sample for me. But now I am smarter for the next time I post such a question ;-) – Christoph Feb 12 '12 at 18:40

2 Answers2

6

Since you addressed this question specifically to UI designers...

Why do I need such a thing? [...] I was thinking that it would look pretty cool to use such a control to set the volume of the amplifier.

Whether it looks cool or not, any UI designer that's worth her salt will tell you not to use such a control because it's virtually impossible to use, at least with a mouse (this might be OK on a touchscreen-only device). Mice are linear pointing devices; it's a nightmare to try and "turn" a circle with one. Don't inflict this pain on your users just for the sake of "looking cool".

Just use a slider. They're still sufficiently cool, and eminently practical.

Cody Gray - on strike
  • 239,200
  • 50
  • 490
  • 574
  • Usually those controls only appear turnable but are actually used like a slider, i.e. click and drag left or right. – H.B. Feb 12 '12 at 13:04
  • @H.B.: Hmm, that hardly seems better. It solves one of the usability problems, but creates another: the visual styling of the control doesn't accurately simulate the way it is intended to be used. And then we've come full circle. What's the point of a GUI if it doesn't make it immediately apparent and intuitive how to interact with the application? – Cody Gray - on strike Feb 12 '12 at 13:06
  • The GUI just represents state and allows interaction with it. The point of such a control is that you can easily put e.g. 64 in a 8x8 grid without using much space. – H.B. Feb 12 '12 at 13:07
  • @H.B.: My point is that a hallmark of a poorly-defined UI is one that "just represents state and allows interaction with it". When that's your philosophy, you end up with something that looks like [this](http://www.uxdesignedge.com/wp-content/uploads/2010/03/idontseetheproblem1.png). Pick up any Apple device and it'll be quite clear the difference between your conception of a UI and one that is actually easy and fun to use. Your justification is nonsensical. You could just as easily fit the same number of slider controls into that amount of space, and then you gain visual affordance. – Cody Gray - on strike Feb 12 '12 at 13:11
  • I never said that this would be the best way to approach UI-design, i just gave the minimum defintion. Sliders waste a lot of space, you *cannot* tell me that they actually can compete with such a circular control. I am also pretty sure that there *is* a reason why such controls are used in professional audio editing/composition software. – H.B. Feb 12 '12 at 13:16
  • @Cody: Dials/knobs are used in nearly all music production software, and since this is for an audio app, I'd say it's definitely the right design choice. – ChimeraObscura Feb 12 '12 at 13:32
  • 1
    @All: First I have to say that I forgot so write that I develop this app für Desktop/Tablet and Phone so Touchscreen is present. What I wasn't expecting is that my first sentense (I think this question goes more to all UI designers) would start such a discussion. I am very happy that u guys didn't just answer with code or samples but also with design suggestions BIG THX. I have to say that on one side Cody is right, using nops with mouse can be painfull. Ovcurse I also provide a textbox under the nope to enter the level also (also forgot to wrote...) – Christoph Feb 12 '12 at 16:14
0

Try this solution: Rotate graphic towards mouse in WPF (like an analog dial)

You may use your own ValueConverter to convert beetwen Angle and actual value.

Community
  • 1
  • 1
Dmitry Polomoshnov
  • 5,106
  • 2
  • 24
  • 25
  • This is looking pretty good THX for the link, I will test this implementation with when the design is finished. I wasn't expecting to receive an answare that fast ;-)But for the next time I will remember that you guys are prette fast at answering questions :-) – Christoph Feb 12 '12 at 16:17