Show HN: An experimental Github/trending User Interface

https://github-trending-plus.surge.sh/

by tinchox5 • 8 years ago

58 45 8 years ago

github-trending-plus.surge.sh

tinchox521• 8 years ago

Hi all! this is an experimental Github trending UI that records the permanence of repositories and developers on trending chart and their relative gain / loss positions.

The frontend is based on zircleUI, which is a frontend library to develop zoomable UIs I created a year ago, while the backend is powered by the awesome work of Hu Chen (https://github.com/huchenme/github-trending-api)

There are a lot of cool projects based on Github Trending (you can find some of them at https://libraries.io/search?q=github+trending), this proposal is just a conceptual approach.

Here is the repo https://github.com/zircleUI/github-trending-plus

androidgirl• 8 years ago

Thank you for making ZircleUI!! It's been insanely fun to make interfaces with and I use it for a smattering of apps on my desktop.

tinchox521• 8 years ago

It's very rewarding for me to know you like zircleUI and you are doing things with it. Thank you!

mromanuk• 8 years ago

maybe you can share your apps? would be really cool.

sam0x17• 8 years ago

feedback: the labels below the circles are very hard to read because they get cut off so soon.

tinchox521• 8 years ago

Thank you for the feedback. Yes you are right I have to improve this part... cutting off or not depending on what device is being using.

kasparsklavins• 8 years ago

* Animations are jaggy. On a quadcore. Just why?

* Accessibility is 0. Cant open external links in a new tab. None of my navigation shortcuts work.

tinchox521• 8 years ago

Thats weird usually the animations tend to be smooth even in less powerful cpus and I've just check the external links and seems to work well. Could you tell what type of device and browser are using? Thanks

kodablah• 8 years ago

Chrome Android mobile...I want to hold down a circle and be presented a link to bookmark, open in a new tab, go back from when I click it, etc. instead it just does local animation to another circle which is probably what GP was disappointed about (i.e. your nav should work with browser nav instead of against it).

mxstbr• 8 years ago

It's also pretty stuttery on my 2017 MBP in Chrome, for what it's worth.

Maybe try developing with CPU throttling activated in the Chrome DevTools? https://umaar.com/dev-tips/88-cpu-throttling/

all22• 8 years ago

Make the project title a link. It isn't intuitive that the "Star It" button is the link out. I want to see a project before I consider its value (adding a star).

Animations aren't awful here. (Core i5, 12Gb RAM, Linux, Firefox)

You could convey more information with a table. It would be more readable, easier to look over, and accessible. You could even have fancy animations and decorations when a user selected a cell/column/row.

This kind of zoomy interface doesn't easily allow lateral movement in the data (in fact, it forces the user into a sort of 'depth-first' navigation).

tinchox521• 8 years ago

Thank you for take your time to comment! I understand your preference for a more classical approach, but in this experiment, I'm just exploring some uses of the zircleUI library.

Regarding the label "star it", you are right it is confusing because you are not actually adding a star, you are just opening a link to the repository.

Sorry about that It would be great if you want to open and issue in https://github.com/zircleUI/github-trending-plus

all22• 8 years ago

It would be great if you want to open and issue

Consider it done.

I understand your preference for a more classical approach

It isn't a preference for the 'classic' so much as I have a certain expectation of functionality.

If you had a way to navigate to other nodes at the same level in different branches , I would be much more comfortable with the usability.

KasianFranks• 8 years ago

Reminds me of Grokker https://www.researchgate.net/figure/Grokker-Visualization-of...

tinchox521• 8 years ago

haha yes!

piocho2• 8 years ago

I just have a few try on it and I find it quite laggy. Example : go to -> top devs -> choose one dev -> go back . Here is super laggy. Am I the only one ? (Edit : no i'm not :D)

tinchox521• 8 years ago

Indeed, you are not the only one. I'll try to figure out what is happening and fix it ASAP.

tinchox521• 8 years ago

I've just made a change in the source code. I don't know if now it's working . Could you try it again?

piocho2• 8 years ago

Yes it is working ! :D

iamrobschiavone• 8 years ago

I don't know why you are being downvoted. It is a cool project, and, as its title says, it's experimental. It's okay to miss a few details.

Keep building stuff.

tinchox521• 8 years ago

Thank you! I will :)

detaro• 8 years ago

Seems really the wrong application for this paradigm.

Animations are fluid on my laptop, but IMHO too long. Especially if there's little on the screen at once, transitions have to be fast and not get in the way.

tinchox521• 8 years ago

I think for this kind of UI the transitions shouldn't be so fast because the idea is not loose context. However, I would add a property to ZircleUI to set the speed the developer feel more confortable.

mpolichette• 8 years ago

I do think this kind of UI needs an animation, but I don't think its necessary for that animation to be slow.

I too feel like I'm waiting forever for it to "get there". The other thing I don't care for is that it takes 2 steps to go change the language...

This is solved in this app by repeating the language switcher under the top list, but then repeating content starts to break the "Where am I" question.

ericintheloft2• 8 years ago

Really cool!!

IshKebab• 8 years ago

Ha this reminds me of Flash websites from the 90s. Looks kind of cool but it's not a practical UI at all.

Much worse than a plain list in terms of usability (and thankfully most web designers seem to have learned that lesson).

Still, nice experiment.

Insanity2• 8 years ago

Cool project :) Not something I'd really use but it's neat to make.

Small mistake though, when it can't find trends, it has a small typo in the error message:

     Oops!! No trending developers for Python. Try another Languaje / time

Languaje should be Language :)

tinchox521• 8 years ago

Indeed that is my Spanish :) Thank you!

Insanity2• 8 years ago

I was thinking it sounded a bit like "Lenguaje". It turned into Spanglish :)

De nada ;)

hurricaneSlider• 8 years ago

Think you might not be encoding the language filters correctly. I'm seeing a lot of C when filtering by C#

tinchox521• 8 years ago

That's true it seems a bug in the API. I'll open an issue informing that. Thanks!

tinchox521• 8 years ago

It seems that now it's working well https://github.com/huchenme/github-trending-api/issues/14

rubenhak• 8 years ago

While this looks cool, I've got a feeling that soon there will be office assistant paperclip and skype integrated to github.

Semaphor• 8 years ago

Filtering by C# filters by C instead

tinchox521• 8 years ago

That's true it seems a bug in the API. I'll open an issue informing that. Thanks!

tinchox521• 8 years ago

It seems that now it's working well https://github.com/huchenme/github-trending-api/issues/14

Waterluvian• 8 years ago

The design is neat and cute but doesn't serve any useful purpose. I like the concept but the website only gets in my way.

But for what it's worth, it does work nicely on my mobile device. That was a pleasant surprise.

tinchox521• 8 years ago

Thank you! Yes I think I put more efforts on mobile devices than desktops.

maddyboo• 8 years ago

I personally love this! I think the concept is especially fitting for mobile use. It would be nice to be able to swipe left/right to advance between project pages and projects themselves.

Good work!

tinchox521• 8 years ago

Thank you for your comment!! I agree with you this thing seems to fit better on tablets/mobiles

igolden• 8 years ago

Awesome product - one suggestion, add support for browser history and pressing the back button.

Looks great!

tinchox521• 8 years ago

Thank you! this feature should be easy to add since zircleUI can be use with vue-router. I’ll try in some days

Show HN: An experimental Github/trending User Interface

Related Stories