Hacker News new | ask | show | jobs
by kirktrue 1952 days ago
Looks great!

I know it should have been more obvious, but I didn't realize the text was editable. I was looking for an 'upload your code' button. Maybe put one of those "Try Me!" badges with an arrow pointing to the code like on toy boxes?
2 comments
umvi 1952 days ago
It's par for the course with Apple-esque UIs. Like the classic "invisible scrollbar"[0] that prevents you from knowing you can scroll something down and see more. Form > Function

[0] https://svenkadak.com/blog/scrollbar-blindness

link
chrisseaton 1952 days ago
How can you make text look editable?
link
zardinality 1952 days ago
Blink the cursor at the end or highlight the text area sound reasonable to me
link
bikeshaving 1951 days ago
Trying to get an input to autofocus with any reliability in browsers is the third hardest problem in computer science.
link
lights0123 1951 days ago
You can make an (obviously) fake blinking cursor at the end possibly with a label showing that it's editable.
link
airstrike 1951 days ago
Fake the cursor if needed
link
galaxyLogic 1951 days ago
How do you make a fake cursor that works? When you click anywhere within the text, how do you know where to position the fake-cursor then? If you use arrow-keys it should move the cursor left and right and up and down respecting the line- and character boundaries.

One of the shortcomings of HTML/CSS seems to be that you can not style the cursor a.k.a caret.

link
umvi 1952 days ago
My point is that when you focus too much on beauty, you tend to sacrifice some functionality. There are tons of ways to signal that text is editable, but most of them are "ugly" or not elegant. To go to the opposite extreme, you could build a functionally equivalent website that is super basic and has no CSS - literally just a textarea to edit the code, checkboxes for the options, and buttons to generate the image. You get the same output, but it's not as pleasing to look at - but hey, it's highly functional and you know everything you are allowed to do at a glance.

The goal for most people is to strike a balance between form and function. In my opinion, I personally think you should always err on more function than form, but the Apple-esque UI design philosophy tends to favor form over function - you know, getting rid of "ugly" UI elements that traditionally telegraphed functionality.

link
jstanley 1951 days ago
Put it inside a textarea, and don't break the textarea styling.
link
thomaspaulmann 1952 days ago
Good feedback! We got a similar request for the title. Gonna look into how we can improve it
link