5 ms·
was this shared to illustrate an example of bad UI? I'm like the target audience for this.. highly movtivated to learn D3.. HOwever this UX doesn't even make
by jordache 11y ago
was this shared to illustrate an example of bad UI?
I'm like the target audience for this.. highly movtivated to learn D3.. HOwever this UX doesn't even make my want to click play on the video.
- Ronsenshi 11y agoAgreed. UI/UX is laghably bad. Is it that hard to find competent designer for some of those ~$11,000 that were collected on Kickstarter?
- ottertown 11y agoSeriously? I know HackerNews can rock the haterade like no other, but why aim that at developers who took months out of their lives to build a tool for the open source community? And why do so with such unhelpful criticisms? And do you think the team that built this had anything but a huge net loss in opportunity cost? $11k is an above average software engineer's monthly take home. This was built in at least a few months with several engineers. If the UI is laughably bad, surely it should be easy to list out some constructive criticisms rather than disparaging insults? I will offer some: 1. One defense of the default UI is that in bl.ocks.org, most examples are shown with the visualization on top and the code on the bottom. Maybe they were trying to offer a similar experience, but I agree it doesn't make sense as the code will almost always be longer in height than the output it creates. Side by side should be the default view, and the code should be on the left, output on the right. 2. The inability to resize the code view when in side by side mode (clicking on the ying yang), is also frustrating. 3. The home / about / gallery menu in the top left feels incomplete. It needs styling and a proper home. It feels like it was just stitched on. 4. Having the video seems like an okay idea but I think most people are used to in browser editors at this point and don't need a video explanation. The UI should speak for itself in this regard. You could have some instructions commented out in the editor for how to get started, but that's it. 5. Borrow from others: jsbin, codepen, jsfiddle... Overall, I think this could be a really helpful tool and this is a strong prototype. The UI needs some work but the core functionality works well, and I like that I don't have to rerun the code to see the output.
- enjalot 11y agoThanks for the constructive criticism! 1. You got it spot on, I wanted to keep a tight coupling with bl.ocks.org. Personally I spend most of my time in side-by-side mode which is probably indicative... 2. This one is a struggle, I want the width to stay 960px so that the end result is more likely to be compatible with bl.ocks, but this might be too patronizing. 3. Yep... 4. Yeah, I'm still working on this. I do think a tutorial is necessary for all the ways this can improve a person's workflow. Also, a lot of people will start with d3 here (I use it to teach, and expect others will too). 5. I've definitely paid attention to those, trying to take the good parts but stick to some firm design principles (mainly, code in blockbuilder should work 100% the same in bl.ocks.org AND when you clone it locally). Thanks again for this comment. Please shoot me an email at enjalot@gmail.com or hit me up on twitter if you have more ideas/questions!
- Ronsenshi 11y agoIs it really that baffling to see critical opinion without constructive criticism as a reply to some other comment? If my intention was to leave constructive criticism I would have done it as a comment to the post itself. Kudos to you for writing good constructive criticism. In this case, though - I'm agreeing with a parent comment and giving my general impression about design. And listen, if this project was done without any funding I wouldn't have said a word - I understand that you can't expect great design from a side-project made during weekends or evenings. However, in case of blockbuilder.org there was a kickstarter campaign which collected $11,205. Based on github stats [1] there were only two active developers and only one of them was active within last couple of month. Based on the same github stats there should be around 6-7k lines of code. Do you think that is something that should take more than 2 months of work and cost $11k? What I'm getting to is the following - author of the project decided to work on it and in its current state to me it looks like $0 were spent on it. Again, I repeat that it only looks like that to me. Given all that and the fact that project is considered as "finished" (Kickstarter: "Estimated delivery: Oct 2015") - I'd say it is a fail. I don't see people using it in its current state, therefore it did result in any positive outcome for the backers. [1] https://github.com/enjalot/building-blocks/graphs/contributors https://github.com/enjalot/building-blocks/graphs/contributo...
- giancarlostoro 11y agoIs there a 'UX Hall of Shame' somewhere on the internet? This one belongs there, I figure they're using a larger monitor, but when you're on a smaller laptop with a lower resolution it sounds crazy.
- enjalot 11y agoHi, I'm the creator of this. Would you mind giving me some more detailed feedback at enjalot@gmail.com? I'm actively working on making the first run experience better. I consider it "functionally complete" for my Kickstarter audience, who weren't coming at it from a blank slate. Now I need to make it easy for people to adopt who are new to the tool, and even new to d3! One of the design principles I'm wrestling with is that I want the home page to be where you go to create a new block, minimize the friction for all users. The problem is that most people expect a home page to tell them what a project is about. My existing solution is clearly failing to strike the balance, so I'd like to find out how to do that. thanks!
- jordache 11y agoHi, I'm definitely in the blank slate group. Not to D3, but the blockbuilder product. The main suggestion is for the UI to work across a sweet spot of screen resolutions. The default top/bottom layout on my 13" MBA shows only 8 lines of source code. In the side/side view, the width of the source code element allows very few characters before wrapping starts.