Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update Layer panel icon components for better comprehension #6755

Closed
1 task done
LuniMoon opened this issue Jul 5, 2024 · 7 comments · May be fixed by #7207
Closed
1 task done

Update Layer panel icon components for better comprehension #6755

LuniMoon opened this issue Jul 5, 2024 · 7 comments · May be fixed by #7207
Labels
😤Non optimal UI A bug/issue where the UI is usable but not optimal

Comments

@LuniMoon
Copy link
Collaborator

LuniMoon commented Jul 5, 2024 •
edited
Loading

Is there an existing issue for this?

Describe the bug

Based on TheQuirkyGamer feature request on the forum

The user reports that it is hard to distinguish which are the locked or unlocked instances on the instance list. Specially when the list is long.
image

Suggested solution:

Screenshot 2024-07-05 at 14 53 33

Update the layer panel with an updated icon button.
Look for the specifications on the file "Components" and search for "Clickable-Icon"
Screenshot 2024-07-05 at 14 43 37

This design should allow the eye to make a distinction between default state (Placeholder in the Component) and Active (Enabled)

Steps to reproduce

Long list of objects in the instance panel

GDevelop platform

Desktop, Web, Mobile

GDevelop version

5.4.204

Platform info

OS (e.g. Windows, Linux, macOS, Android, iOS)

OS Version (e.g. Windows 10, macOS 10.15)

Browser(For Web) (e.g. Chrome, Firefox, Safari)

Device(For Mobile) (e.g. iPhone 12, Samsung Galaxy S21)

Additional context

No response
@LuniMoon LuniMoon added the 😤Non optimal UI A bug/issue where the UI is usable but not optimal label Jul 5, 2024
@tristanbob
Copy link
Contributor

How about placing the controls to the left of the object name?

@LuniMoon
Copy link
Collaborator Author

LuniMoon commented Jul 5, 2024 •
edited
Loading

I've placed them on the right so it's easier to reach with the thumb on mobile (plus it follows upcoming UI patterns with the action buttons to the right... like the Project Manager for example).

@jack-ii
Copy link

jack-ii commented Aug 8, 2024

Good mockup :)
But this is the Instances List Panel, not the Layer Panel
Hide/Show is not yet available for objects in the editor
1 of 6 titles as an icon doesn't fit so well, especially because the panel and column are much wider in reality than on the image

Instances List Panel: Angle
Properties Panel: Rotation
I think "Angle" would be correct so that it fits the events

@LuniMoon
Copy link
Collaborator Author

LuniMoon commented Sep 19, 2024 •
edited
Loading

Update:

  • The typo on the original issue was corrected. Now it says "instance list" instead of "layers list".
  • Note on hide/show: this is an equivalence on the Figma file "Editor Panels" -> Sandbox Layers. That's the main reason why this mockup has hide/show icons but we do not need to add them on the first iteration of the instance list panel.
  • Regarding icons as titles: we keep the 'layers" icon, and we'll replace "Angle" with its icon
  • As for the icon for angle... we used "icon/Angle" (see Icon file on Figma) in the 1st design, but we later changed it to the "Rotate Z" icon to align it with the 3D icon set... probably we'll have to change the tooltip title on the instance list panel to "Rotation (Z)" and use its icon.

@k-vijay-05
Copy link

@LuniMoon can i work on this?

@LuniMoon
Copy link
Collaborator Author

@k-vijay-05 go on :)
This is the final image
Screenshot 2024-11-28 at 17 06 25

@k-vijay-05 k-vijay-05 mentioned this issue Nov 29, 2024
Open
@LuniMoon
Copy link
Collaborator Author

LuniMoon commented Dec 2, 2024

Discussion continues here #7207

@LuniMoon LuniMoon closed this as completed Dec 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
😤Non optimal UI A bug/issue where the UI is usable but not optimal
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

updated the instance list icons k-vijay-05/GDevelop
4 participants
@tristanbob @jack-ii @LuniMoon @k-vijay-05