24 comments

[ 5.3 ms ] story [ 63.0 ms ] thread
I've always been a big fan of the Snapchat/Instagram Story UI format but I wasn't the biggest fan of the content on those applications. At the same time I wanted a single place where I could get up to speed on various topics. I ended up combining the ideas.

This works exactly as Snapchats 'Discover' Section. There is a collection of 'streams' of various topics (news, gaming, nature, etc.) You click a stream, and you can tap or click to go forward or back. When done the stream viewer closes and the stream link is greyed out until new items are available. It has embedded video and picture support and feels like modern day 'channel surfing'.

Would love feedback and any section ideas!

I think bloomberg's tictoc, in it's earlier incarnation, was doing something very similar. It seems to be now renamed, redesigned and merged with some other project.

Their version was heavily based on video. I might remember it wrong, but I think video was also their core problem. I tried it once but didn't really get it, as I hadn't used Snapchat nor Instagram.

Because Tictoc was a sort of old school, video first solution, they were missing the crucial "would you like to know more" step. You could just consume it, but not on your own terms, which kind of makes all the difference.

TikTok places far more emphasis on video and visual consumption and less of reading or text.
It's a different product, with a slight difference in spelling.

Tictoc used to be a visual news feed created by Bloomsberg, aimed for millenials. It came out around the same time or just before Tiktok landed in west.

Cool, but might work better with curated news. Many of the stories I tried are just blank/bad images.
Hey, thanks for checking it out!

Unfortunately, not all items have a picture associated with them as that depends whether the associated webpage has an open graph meta tag image.

Making sure items/their pictures looks nice is another thing, which I'll definitely take a look at.

Wow, that goes way too fast! You could maybe pause if the user keep their finger pressed, or increase the time between stories?
or give us the option to set time
This. Most UIs need more detailed controls for the user. Everyone is different. One size or setting does not fit all.
Thanks for the feedback. I adjusted the auto-timing to be longer. I realized that if someone is a 'speed reader' they will be the user that uses the 'next' button. For the rest, it should give them a little more time.
this is cool, but stories go by too quickly. also needs some kind of swipe up to read inline functionality.
Read inline is definitely on the radar.

For now, I added the option to hold the bottom-right time bar to pause the advancement.

Not a bad idea, and implementation is solid mvp.

Some thoughts:

1) Given that you have clear categories available, it might be worth it to show the name of the category on the reel as well. Sometimes headlines are very broad, and they might not clearly imply the category. I tried a few categories, and in the end forgot which one I was currently watching. -> By showing category indicator you would give additional context for the watcher, on why a specific story is important. I get there's background color doing more or less the same thing, but only if a picture is missing. Color is great for seasoned users (additional pattern would be great for color blind people), new users would probably need clearer information.

2) after the reel ends, you might want to show a final screen, before jumping to the home screen. This way, people could still tap the prev button, if they wanted to recheck some headlines that they missed.

Hey thanks for your feedback!

I ended up pushing an update with both your ideas.

Did you use any template to get stories UI? I would love to hack something similar for a subgenre!
Annoyingly fast, had to close it.
You can now hold the bottom-right timing bar to pause advancing to the next item.
This is a pretty cool website. Reminds of Tiktok with the seemless continuously loading videos, in this case being news articles or other interesting videos. I really like the tv show/movie trailers subsection. Few things to point out: (1) one thing I would do for the news articles is slow down the timer. Perhaps 20-30 seconds. (2) Also image backgrounds and video quality can look off sometimes. (3) The back and forth arrows blend into white or noisy background images -- can the arrow colors change dynamically.
Good points!

I added a feature which lets you pause the auto skip by holding the progress bar in the bottom right corner. Should give you more time to finish reading.

I also added some contrast to some up UI elements. I do want the prev and next to fade into the picture though.

Is there a mobile app for this? Currently I am "add to home screen" as an alternative. nice work:)
No mobile app for now, but I’ll consider it!

Add to home screen works pretty well!

Congrats. I love this! Where do you get your content from and how often do you refresh it? How do I request for different categories? I would love to add a few more for politics and covid-19
Hi, I would love to see this being localized and configurable.

Would love to talk if you are interested. Europe here.

This is a great idea! Do you have any plans to add keyboard shortcut support (a/d to go between stories, w/a/s/d to go between categories)?