Hacker News new | past | comments | ask | show | jobs | submit login
Show HN: GitHub Stats Dashboard Powered by GraphQL API and GitHub Action (github.com/pingcap)
73 points by Hooopo on June 21, 2023 | hide | past | favorite | 19 comments



I'm all about fun/creative aesthetics but this is a terrible implementation of the sketchbook idea. The font, the extremely tortured pixelated rendering, the low contrast, the excessive grid texture background...


Agreed, the style is cute but extremely difficult to read, which defeats the purpose.


I think a clean font choice would make this design far more usable


Can prob keep it for headers, but for any smaller text it just looks blurry.


How much did having it on HN cost in additional charges ?


I know other existing projects like this (GitHub profile generators), although I like the idea you can customize the template.

However, it requires quite effort to deploy this one as you need to setup different services for the DB, deployment, etc. Since the data is pushed based on a GitHub action, I'm wondering if it's possible to just build a static site based on it. In the end, we're storing "snapshots" of the data to query them later.


Agreed, I like it, but I'd be way more interested if it dumped out a static site on a GH Pages branch. I've never even heard of 'TiDB Cloud', I don't really want an account and billing there, to have to wonder about their security practices and likelihood of disappearing overnight (quite high? because I haven't even heard of them?) just for GitHub profile readme.


Yes, since the data pipeline is universal, there can be multiple options on the UI, such as https://github.com/evidence-dev/evidence, which can regularly build static reports using SQL and data from the database through GitHub Actions.


I don't understand why this requires Vercel. This could just be hosted on GitHub pages instead.


What's the name and point of the weird shake effect when you mouse over a chart?


The chart is using rough.js, which generates a random hand-drawn style every time. Currently, there is no method to lock the random seed. I'm thinking about disabling the animation to see if it can remove the jitter. It indeed seems a bit strange, haha.


The docs don't agree with you - https://github.com/rough-stuff/rough/wiki#seed - if you use a fixed non-zero value it should be the same every time.


It seems you are right, dude :)


I'm sorry for the negativity but the design is awful for a dashboard. Weird distracting animations (graphs wiggle on hover), the lines are janky due to the cartoonish draw style. No clearly visible separations between the stats and an annoying background texture over the whole page that actually could make sense as a grid if only things were aligned to the grid. It also feels slightly sluggish on my laptop.


I don't like coming to the comments and being negative either, but I have to agree. I feel like the style causes a lot of accessibility issues. It is nearly impossible for me to tell what is going on. I think it mostly comes down to the use of rough.js. Are there other options available? I do like the actual content, just not how it is displayed.

- The font is hard for me to read, even on the left where its horizontal and black, and nearly impossible to read under the currently working on graph.

- I can barely see 'commit comment' on the activity trends graph in one spot and nowhere else.

- The shades on the pull request size history are so close together I can't tell what is what at a glance.

- TypeScript and CMake on the pie chart really blend with the colors next to them.

- On the contribution time graph the rough circles are really distracting and then the graph itself has lines that almost line up with the background and end up basically double vertical lines for more distraction.


That is so beautiful.


Thanks


yeah I was going to say, I have no idea what your dashboard is for, but I love the visual styling and will likely copy it


Please don't. It's a nightmare from an accessibility point of view




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: