Lychee icon indicating copy to clipboard operation
Lychee copied to clipboard

[Enhancement] Improve Lychee's landing page to ease navigation

Open pawlakm opened this issue 1 year ago • 3 comments

Hello,

A recurring feedback I get from friends and family is that the landing page is not very intuitive (especially for older people, but also for all people not knowing lychee and those having a huge screen). Here is how it could be improved to, in turn, improve global user experience:

  • Move the "gallery" link from the top right corner of the page to the center of the page
  • change the link text from "gallery" to "Enter the gallery"
  • Increase font size of the link
  • Add a "Navigation tip" message below the entrance link such as "Remember: you can use keyboard shortcuts to navigate through the user interface.". With a hyperlink pointing to https://lycheeorg.github.io/docs/keyboard.html

This would have the double benefit of removing the initial frustration of not knowing where to click and explaining that shortcuts do exist and can help with navigation (especially esc, f, i keys).

At least 30 of my guests will probably thank you if you add this.

Thank you and continue the great work.

M.

pawlakm avatar Jun 12 '23 00:06 pawlakm

If you would like to help, I am more than happy to accept pull requests on the livewire/more-work branch.

The file you will want to modify is the following: https://github.com/LycheeOrg/Lychee/blob/master/resources/views/livewire/pages/landing.blade.php I just rewrote it to use tailwind css instead of Jquery and settimeout(). This should make it easier to manage. Animations are registered here: https://github.com/LycheeOrg/Lychee/blob/master/tailwind.config.js#L114

Outdated info

To use that branch you will need to do the following:

git checkout livewire/more-work
composer install # needed because new dependencies

edit the .env with the following lines:

# enable Livewire
LIVEWIRE_ENABLED=true

and then get npm running:

npm install # needed to use vite
npm run dev # needed have hot reloading & 

Then you will be able to access the livewire side by going to yourlycheeserver.org/livewire. I advise you to do it locally though as the security has not been hardened yet on the livewire side.

ildyria avatar Sep 02 '23 20:09 ildyria

I support this request. Alternatively or in addition to that, you could just pop up the login box on the landing page after like 5 seconds or smth.

marck-consulting avatar Jul 22 '24 14:07 marck-consulting