badges / badges/shields

Improve badge details / search results for searches with multiple matches

Open
#9,393 8 comments 1 reaction 0 assignees View on GitHub
frontend
Dominant language
JavaScript
Stars
27.2k
Forks
5.6k
Avg merge
1d 8h
Merged PRs (30d)
46

Description

:clipboard: **Description**

The search results on the site for searches with multiple results don't show any information to discern the results. It is impossible to figure out what each result is without clicking on it.

![inline results](https://github.com/badges/shields/assets/2847328/84db1b8c-2356-437f-8661-56f305cda941)
![results page](https://github.com/badges/shields/assets/2847328/f7fd7551-a054-4d4b-b8a2-afc573a2d954)

Even clicking on each result doesn't give much information what the badge is before filling in the fields and generating the badge.

![image](https://github.com/badges/shields/assets/2847328/6466c242-1939-4966-b1d8-35d8c1323797)

On the old website, I remember each badge having a description and example badge, making it easy to immediately see what a badge was and how it would appear. It would be very helpful having this information on the new site and in search results.

![shields io_](https://github.com/badges/shields/assets/2847328/695b83d7-a4e2-4144-a89c-9e609d438b44)

Contributor guide

Open the contributing guide

Research direction

Start by reviewing the current site's search-results and badge-detail screens shown in the issue, along with the existing discussion and screenshots. Define how descriptions and example badges should appear for multiple matches and on each badge view; done means users can distinguish results and understand a badge's appearance before filling in fields.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.