Home » Is this rotating cube interface user-friendly?

Is this rotating cube interface user-friendly?


I filled in the form with some mainly dummy data (see below) as I know you said this was just a working example. My only real concern with this whole design is that the input fields do not accept input unless that face of the cube is actually visible. I think that would be annoying for most users to be typing into an input field they cannot see and then discover that when that face comes round again that that field has lost all the stuff you typed.

Luke Wroblewski has some great info on his site with respect to signup forms and it’s worth taking a look in order to fine tune the layout. I noticed the street address details were all on one line, and I’d suggest splitting up at least into street and zipcode or postcode, with another optional field for more complex addresses. Check this article on UXMatters for dealing with international addresses in forms.

I’d consider whether you really need to get the social security number at first sign up. If it’s definitely required, then I’d suggest giving some inline help as to why it’s needed as some users can be a bit funny about that sort of detail. If possible consider obtaining information via gradual engagement.

I’d probably choose a less vivid green, as it’s a bit offputting, and change the red text to a different colour. You can use the Colorblind Web Page Filter in order to see how it looks to colour blind users. Don’t be afraid to use more colours – but not too many! Smashing Magazine have a 3 part article on colour theory.

I think the whole concept has a lot going for it and once the main UX issues have been ironed out it’s going to look pretty slick. I think users will love the novelty of it. Sign up forms are so dull these days. This article on A List Apart about why sign up forms must die (again by Luke Wroblewski) is spot on. I think this example might just bang the final nail in the coffin of sign-ups, so good luck with it!

enter image description here

Serious answer: it’s terrible

To improve it, you could make it not be a rotating cube.

The main problem is that I can’t control it. A good user interface makes the user think “hey, I am awesome! Look what I can do!”

This makes me think, “holy crap, I suck. I can’t even fill out a form.” I have to keep a 3D mental model, fill stuff in upside down, and deal with text displaying at an angle. It’s like trying to play guitar with handcuffs on.

If space on the page is a concern, use an accordion form. Then the user can see the whole form, easily gauge their progress, and display only what they need at the moment.

Silly answer: it’s great!

I’m glad to see you freeing forms from their 2D shackles. Can you abstract this into a library that constructs N-sided 3D shapes, where N is the number of form sections I need? If the math is too hard, maybe we can re-arrange our forms to fit easy-to-render shapes – break them into 12 sections instead of 11, etc.

Also, let’s have more blinking lights.

NO. In any way, even if you make it a triangle or any geometrical shape, the answer will be still NO.

I visited your working example (guessing is a beta or something). I tried to fill the form fields without luck. I tried to read what it is written, again with no luck. Then, I closed the tab.

I read again your question, re-visited the cube and exited after 1 sec, saying “you gotta be kidding me”.

Well concluding my answer and in my eyes this is not a good UX. It is far from good. Web is getting easier and easier, why do you want hard things?!

My answer to your question is NO. For sure.

Related Solutions

Calculate the sum with minimum usage of numbers

Here's a hint: 23 : 11 + 11+ 1 ( 3 magic numbers) 120: 110+ 10 (2 magic numbers) The highest digit in the target number is the answer, since you need exactly k magic numbers (all having 1 in the relevant position) in order for the sum to contain the digit k. So...

Why not drop the “auto” keyword? [duplicate]

Your proposal would be rejected on the basis of backward compatibility alone. But let's say for the sake of argument that the standards committee like your idea. You don't take into account the numerous ways you can initialize a variable widget w; // (a) widget...

Recursive to iterative using a systematic method [closed]

So, to restate the question. We have a function f, in our case fac. def fac(n): if n==0: return 1 else: return n*fac(n-1) It is implemented recursively. We want to implement a function facOpt that does the same thing but iteratively. fac is written almost in...

How can I match values in one file to ranges from another?

if the data file sizes are not huge, there is a simpler way $ join input1 input2 | awk '$5<$4 && $3<$5 {print $2, $5-$3+1}' B100002 32 B100043 15 B123465 3 This Perl code seems to solve your problem It is a common idiom: to load the entire...

Javascript difference between “=” and “===” [duplicate]

You need to use == or === for equality checking. = is the assignment operator. You can read about assignment operators here on MDN. As a quick reference as you are learning JS: = assignment operator == equal to === equal value and equal type != not equal !==...

Compiler complains about misplaced else [closed]

Your compiler complains about an misplaced else because, well, there is an else without a preceding if: // ... for (j=1; j<n-i; j++) { if(a[j]<=a[j+1]) { // ... } // END OF IF } // END OF FOR else { continue; } // ... The else in your code does not follow...

Bootstrap – custom alerts with progress bar

/* !important are just used to overide the bootstrap css in the snippet */ .alertContainer { border-radius: 0 !important; border-width: 0 !important; padding: 0 !important; height: auto !important; position: absolute !important; bottom: 15px !important; left:...

How to Garbage Collect an external Javascript load?

Yes, s.onload = null is useful and will garbage collect! As of 2019, it is not possible to explicitly or programmatically trigger garbage collection in JavaScript. That means it collects when it wants. Although there is cases where setting to null may do a GC...

Math programming with python

At first, what you are looking for is the modulo operator and the function math.floor() Modulo from wikipedia: In computing, the modulo operation finds the remainder after division of one number by another (sometimes called modulus). for example: 12%12=0...

Android slide over letters to create a word [closed]

Here some advice you can use: First for each cell you can create an object that represents the state of that cell: class Cell { char mChar; int row,column; boolean isSelected; } then you can create a 2D array of your cells Cell[][] mTable = ... For views you...

Sum two integers in Java

You reused the x and y variable names (hence the variable x is already defined in method main error), and forgot to assign the ints read from the Scanner to the x and y variables. Besides, there's no need to create two Scanner objects. public static void...

Extend three classes that implements an interface in Java

Using this simplified implementation of the library, using method() instead of M(): interface IFC { void method(); } class A implements IFC { public void method() { System.out.println("method in A"); }; } As akuzminykh mentions in their comment You'd write a...

How to set the stream content in PHPExcel? [closed]

Okey, First thing first PHPExcel_Worksheet_MemoryDrawing() can't solve your problem if you insist to use stream content and pass that to your worksheet your PDF will not render your image. But you can use `PHPExcel_Worksheet_Drawing()' if you want to render...

How to remove all files from a directory?

Linux does not use extensions. It is up to the creator of the file to decide whether the name should have an extension. Linux looks at the first few bytes to figure out what kind of file it is dealing with. To remove all non-hidden files* in a directory use: rm...