Panel icons (Quicksave shouldn't be floppy disk)

Started by nin10doadict, January 12, 2019, 04:47:57 AM

Previous topic - Next topic

0 Members and 2 Guests are viewing this topic.

nin10doadict

Split off Level solving contest #2,
split off Autosave replays: Run to end?

Quote from: Minim on January 09, 2019, 09:54:19 PM
I thought the F3 button was a "save replay" button. That icon that looks like a save button has deceived me. :-[

Quote from: Simon
I apologize for the lousy UI and how it caused you to lose the solution. :lix-trouble:

Bad icon for quicksave: I've even noticed the problematic icon (disk) last year and filed an issue: #293 Savestate icon, don't use floppy disk (means: write file). But I've never thought that it's so terribly misleading that it produces data loss. I merely assumed people would be confused what would be saved, and thus avoid clicking the disk. But your story is 100 % plausible, the replay is obviously the prime candidate for a file to be saved to disk.

Makes the issue more urgent than mere cosmetics. I should redesign the icon soon. What icons make sense for quicksave and quickload?

On the topic of save/load icons, the ones used in The Incredible Machine: Even More Contraptions immediately come to mind.
Spoiler

I think they are pretty clear about what they do, even without the text.

Quote from: SimonQuicksaving is more like bookmarking than saving. Bookmark or camera may be better icons? Website bookmark icon is sometimes a 5-pronged star? Very hard to convey that we don't write a file. We cache the replay and position in RAM.

Minim

#1
Just throwing in a quick suggestion: I think only the icons need to be changed: Instead of a floppy disk and folder, How about a camera icon for the Save state and something like a film frame for a Load state respectively?
Level Solving Contest creator. Anybody bored and looking for a different challenge? Try these levels!

Neolemmix: #1 #4 #5 #6
Lix: #2  #7
Both Engines: #3

Proxima

That doesn't really tell the user what the buttons do. I would guess that a camera icon means "save a screenshot".

Simon

Yeah, camera looks like (save screenshot) much more than (remember game position).

Maybe a flag on a pole? Flags mark something, but they don't do anything else with it.



-- Simon

Simon

Another possible fix that reworks the entire UI: Replace quicksave and quickload with a button that opens the replay editor*. And that menu can get the less-commonly used quicksave and quickload.

*) The replay editor doesn't exist yet. I envision something like NL's ingame menu that deletes skills in the middle of a replay but keeps the remainder of the replay. But I envision it even more powerful than that. :lix-evil: It should also be able to move existing assignments forward and backward, while keeping everything else.

Design history: Quicksave and quickload came first, and only then came framestepping backwards. Framestepping backwards is far more useful, and I've merely kept quicksave/load because it's still occasionally useful.

-- Simon

Simon

#5
I apologize for letting this sit for weeks without feedback. I've worked on new icons. But I'm super busy and will return to Lix only in the next weeks.



From left to right:
  • Nuke, same as ever.
  • Quicksave, not a disk anymore (would mean: write something to file), but a flag.
  • Quickload, a similar flag with a returning arrow.
  • Replay editor. I want an icon for this because I plan in 2019 to make a more powerful replay editor that delete/move assignments from a list. Replay editor is important NL feature that Lix lacks. I wanted this icon to look like a film strip. Sadly, it looks like a Roman colonnade. Needs change. Probably needs to be a fluttering film strip, or an entirely different icon. I considered a razor blade because you cut your replay into the exact shape you want, but razor blades look dangerous.
  • Splat ruler. To attack issue #301 Separate ping-exit and splatruler, a long-time wish by Raymanni. Unsure if this is best possible icon. The double arrow suggests that you can resize something.
  • Ping exits and hatches.
  • The cool shades. Now unused. But maybe the splat ruler feature should also paint trigger areas? Then I'd still prefer the splat ruler icon (see two icons to the left of cool shades), but I've included the shades in this post, for discussion of alternatives.
Please destroy with criticism.

-- Simon

namida

QuoteI considered a razor blade because you cut your replay into the exact shape you want, but razor blades look dangerous.

Scissors might be a bit more considered a similar tool a bit more associated with "cut to modify" rather than "damage".
My projects
2D Lemmings: NeoLemmix (engine) | Lemmings Plus Series (level packs) | Doomsday Lemmings (level pack)
3D Lemmings: Loap (engine) | L3DEdit (level / graphics editor) | L3DUtils (replay / etc utility) | Lemmings Plus 3D (level pack)
Non-Lemmings: Commander Keen: Galaxy Reimagined (a Commander Keen fangame)

Simon

Quote from: namida on March 05, 2019, 07:17:18 PM
Scissors might be a bit more considered a similar tool a bit more associated with "cut to modify" rather than "damage".

Good idea, scissors are easy to recognize.

Only downside is that scissors usually means remove-and-put-in-copybuffer, and these scissors won't remove anything immediately. But that's fine during gameplay because there nothing else to cut or paste besides the replay.

Scissors (to modify) feel better than a pencil, pencil would mean to modify text.

--  Simon

geoo

What about this for the splat ruler? Though I think it's reasonable to also enable trigger area with it, and then the shades (or a wrench or something) might do.

For saving/loading states, not sure what the flag is meant to symbolize... if we have something that non-descript anyway, you might as well go for something more abstract like this: https://cdn.dribbble.com/users/71134/screenshots/1020838/save-icon.png
Still somewhat indicates storing something, but without explicitly invoking the disk imagery.

Simon

#9
The flag marks a point without doing anything with that point. Any other Most other save icons, including the curled arrow, again suggests writing to disk, which is sad. Also Clones used the flag for savestates. Not sure if more games do.

A ruler icon is ideal if we make it easily recognizable. Icons must be visible from the shape alone. I've had early versions that looked like this, I rejected them because the ruler would look like a block. You must squint your eyes to see these markings on it.

We can try glaringly visible its small lines/dents in the side of the ruler. If it doesn't end looking like a saw.

Apparently it's enough to have 2 small lines, then 1 large line, and it will look like a ruler. I'll try.



-- Simon

ccexplore

Quote from: Simon on March 05, 2019, 10:13:03 PMThe flag marks a point without doing anything with that point. Any other Most other save icons, including the curled arrow, again suggests writing to disk, which is sad. Also Clones used the flag for savestates. Not sure if more games do.

Granted I'm not much of a gamer nowadays, but from my limited, possibly very outdated experience, most games don't really offer savestates in the way Lix or even Clones does.  RPGs often do, but they also tend to have an extensive text-based menu system to begin with, and it's easier to just put the options there in plain text without icons.  In many other games (and also some RPGs too), save points are limited and are encountered within the level as some consistent but random object that generally stands out from the environment, but otherwise doesn't obviously scream "I'm a savepoint/checkpoint" on first glance.  They may be mentioned in the game manual or some in-game tutorial.

Most emulators do have savestate features, but again, they also tend to just use a traditional text-based menu system rather than icons.

I don't remember exactly how I learned the UI of Clones, but I seem to recall it does do mouse-over tooltips, which if true is most likely how I learned.  The flag is a reasonable icon, but I suspect it'll be tough to find an icon that most people will immediately recognize as savestate/loadstate--especially when many people may not even expect such a feature in a game--sure, we all can't live without it, but especially for new players, it is rather foreign and never present in any of the official Lemmings games.

Still, maybe the flag is good enough since at least it doesn't imply saving to disk.

If mouse-over tooltips won't be implemented in any form, maybe display some response text somewhere whenever user clicks on the savestate/loadstate icon?  Saying something like "current state of level captured.  Use the next button to the right to reload saved state" or similar.

----------

As for splat ruler, I actually think the double arrow that is also bookended by the lines is standard enough of a depiction of length/measurement, that I don't think it will be confused with resizing.

No plans to try to depict the "splat" part in the icon somehow?  Or is that probably too difficult within the confines of the icon's size?

Minim

Just saw this today and had another idea in my head for save-state and load state buttons.

For a save-state icon, how about a marker pen with the tip coloured red? The load-state would be the red marker's point with a curved arrow next to it that looks like the one already on the existing image.
Level Solving Contest creator. Anybody bored and looking for a different challenge? Try these levels!

Neolemmix: #1 #4 #5 #6
Lix: #2  #7
Both Engines: #3

Simon

#12
Thanks for the ideas! (In the already one week old replies <_<;;)

If I added red in buttons, e.g., as pen marker's tip, that would draw lots of attention to a second-class function. The marker pen is reasonable, although I still think the flag is better to mark/remember stuff? Pen's first meaning is either edit-text or draw-line, neither happens here.

The flag has no obvious first meaning, maybe report-post-to-moderator-on-social-media, but that's very weak association in Lix.

I've redrawn film strip to be wavy and vertical. Now it doesn't look like Roman colonnade anymore. I feel this is even better than scissors.



I'm planning to mix geoo's ruler idea with some horizontal bars at the top and bottom of the ruler. Maybe keep double arrow somehow. ccx is right that double arrow is related to measurement, even though I still think that double arrow's first meaning is resizing.

Yeah, I think splatting is too hard to depict. A skull would be the simplest clear symbol.

In icon design, I feel like topmost priority is to avoid accidental wrong meanings. I hope I don't leave too many good ideas (scissors, marker pen) by aggressively avoiding accidental wrong meanings. The ruler idea passes this test, the double arrow is halfway between failing and passing.




Also progress report, Separate ping-exit and splatruler #301 will be fixed in the next version. I haven't yet begun working on the replay editor, even though the icon is in place.

-- Simon

ccexplore

Quote from: Simon on March 15, 2019, 01:49:57 PMThe flag has no obvious first meaning, maybe report-post-to-moderator-on-social-media, but that's very weak association in Lix.

In Microsoft Outlook (email client) there is a feature to "flag" emails for follow-ups, ie. to essentially highlight the emails you don't want to immediately respond to, but will need to do so later (often by some deadline).  In a vague sense, a quicksave flags the current state of the level for possible re-visit later.  (If you're wondering, Outlook's UI has text displayed underneath all icons in the "ribbon" near the top of window, so there's no issue there with deciphering any icon's meaning.  That of course also eats up valuable vertical screen estate, so :-\)

Anyhow, as I was thinking about it more, quickload is very much like jumping back to a specific point in time in the past.  Kind of makes me wonder if there's some possible depiction of quicksave & quickload, involving a clock face somehow, that can actually convey the concept at play.

As for splat ruler, would having a tiny lix with a downward-pointing arrow below it, all next to a ruler to the right, be more informative?  Or probably just too busy and packed within the confines available?  I do think if you are definitely going with the ruler, also having double-arrow feels somewhat redundant, not sure it'd express anything additional beyond what the ruler already expresses.

Simon





Splat ruler button is now a ruler plus a dashed downward arrow. I hope the dashes suggest motion, and perhaps even acceleration because lower dashes are thicker.

Especially the smaller version of this icon, I fear that would become too busy with { shorter arrow, extra decoration above/below the shorter arrow such as falling lix, splatting lix, or skull }.

Already, the icon combines two items and feels busy. Hmm, geoo suggested a ruler without any extras, also very reasonable.

-- Simon