Replies: 4 comments 4 replies
-
|
I totally agree the existing frontend looks dated and revamping it is absolutely something we've discussed before. e.g: Unfortunately it is a bit outside the wheelhouse of anyone on the current core team. We'd love to accept a contribution from the wider community to improve some of this stuff but it is a big piece of work which is somewhat subjective and loosely defined which makes it a bit of a hard thing for someone to just jump in and work on. |
Beta Was this translation helpful? Give feedback.
-
|
Hi @Andre601 and thanks for the great suggestions! Not sure if you're interested in working on these, though I've tried to pull out the ones that are most actionable into separate issues so you or anyone else can. (We can continue discussing those in the individual issues. And if you're not interested in working on it – no problem at all!)
Opened #7172
Opened #7173
Opened #7174
I'm curious about the use cases here. Can you say more about how you're using Shields on mobile?
Let's track this in #3654
I'd be open to someone designing a dark mode, and adding whatever CSS we need to display it. However I am not sure I understand why we'd need to show a toggle instead of using the system's light / dark mode. If GitHub has that they kind of bury it away. I'm curious your thoughts and happy to discuss further. |
Beta Was this translation helpful? Give feedback.
-
I do have interest, but I lack the experience with front- and backend development to design something here. The best I can do is use a Jekyll theme for my own website and that's kinda it...
To be fully honest here, I don't. But I can see many people using mobile and wanting to make a quick badge to share and use and the site, especially the section about query parameters, isn't very mobile friendly in that regard.
GitHub has the appearance settings which include dark theme, light theme, high-contrast versions of both and colorblind versions of both. A toggle isn't needed, but I can imagine people wanting to use shields with white theme while using other pages in a dark theme. This wouldn't be the first time that happens as different situation may result in different usage-cases. |
Beta Was this translation helpful? Give feedback.
-
|
On mobile, yea, it's not so clear which actions users need to take. Let's leave things as they are until we have some clearer use cases. I opened #7176 for dark mode. In terms of a toggle, I guess I have the same feedback. Let's leave it out until we have an actual use case. |
Beta Was this translation helpful? Give feedback.
-
I'd agree with this. I think in general it's crucial to be mobile friendly in today's, but I also believe that context matters and we should be mindful of effort vs reward (as well as favoring larger factors if push comes to shove between e.g. web and mobile). There's some experiences/applications that I'm skeptical folks really need to use on a phone, e.g. AutoCAD, Photoshop, and I suspect the Shields.io homepage is probably closer to that end of the spectrum than the other. |
Beta Was this translation helpful? Give feedback.
-
|
Heys guys, i am a MERN Stack developer and quite experienced with frontend as well as backend development if ya'll need any help related to frontend development i am more than happy to help. |
Beta Was this translation helpful? Give feedback.
-
|
We have just launched a completely redesigned frontend https://shields.io/ Most of the paint points identified in this post (dark theme, mobile compatibility, about page, better documentation for global params, etc) are massively improved by this piece of work. |
Beta Was this translation helpful? Give feedback.
-
|
Is the old site still hosted somewhere? I find the new site to be more or less unusable. It's way less visual than before which makes it very hard to find the right badges, at least for me as a very visual person. |
Beta Was this translation helpful? Give feedback.
-
While I do like the general feel and look of the site do I think that it could deserve a bit of a make-over to make it a bit more pretty.
Currently do I think the site could benefit from the following changes:
Make proper buttons
The currently used ones look a bit ugly and could deserve a small overhaul
Make proper documentation pages for label options
Having everything on one page is nice, but it also feels a bit cluttered and hard to find the option you're looking for.
Putting them into a dedicated page could also give you the option of adding extra info such as examples to it to show how the options can be used.
Use OS-independend Emojis/Unicode
Some icons such as ☙ seem to be OS-dependant since the icon has a different look on Android compared to Windows.
An OS-independend icon, either through the usage of f.e. Twemoji or by using some SVG icons could help solve this visual inconsistency.
More/Better Mobile support
The site works on mobile... I guess, but having the different categories in a drop-down or sidebar menu could help on mobile to reduce the amount of stuff shown on the site.
Add a main explanation/about section or page.
We get greeted with the shields.io icon, some key phrases like "Pixel-perfect" and "hackable" followed by a search box and categories.
A new user may get confused by this and a small text saying what the page is about would already help to prevent this initial confusion.
Something like the following would imo help to inform about what shields.io is about:
Native dark theme support
While Dark reader works on shields.io do I believe that offering a toggle for light/dark theme would be a good addition. It would also allow Shields, to establish their own theming/branding to use.
Those are the things I noticed and that I think deserve some love and attention.
I know from personal experience how difficult front-end development of a website can be so I don't mind if you would not tackle this or put it as a "nice to have" feature for the future.
All I hope for is, to see Shields.io grow and improve over time, including the website.
Beta Was this translation helpful? Give feedback.
All reactions