Story like Instagram

Hi,

I’m working on a feature like Instagram stories. Here’s what I would like to do:
There is a bar of the user profiles (horizontal list) and if the user clicks on a profile it opens the story. Now the user can go backwards or forward by clicking left or right. And they always see the current user’s story.
How can I make this feature? Thanks in advance. Really looking forward to reading your responses.

Best regards,
Florian

2 Likes

Hey there,

If you need help with this, we have experts that can do this for you! Feel free to email me your scope: alexis.tirado@roundpegs.com and I will see what we can do for you.

Alexis Tirado

1 Like

Hi Florian,
It seems here you need to use 2 Collections:

a. User Collection
b. Stories collections

You create a relationship a + b where user can have multiple stories and a story can only have one user
then you create an avatar list with your users in let’s say “All Users list” screen.

When selecting the user, it should redirect to another screen where you display a list of Stories, where you can user the filter “Current User - > Stories” to only display those of the user you selected.

then you can create a modal screen when user clicks on a story and that modal screen should the the story details from the story list user selected. Let me know if clear.

1 Like

Hi,

Thank you for your response! Yes I‘ve done that. But I don‘t know how to add two buttons, „back“ and „next“, in the modal screen, so that users can see the next story of the next user, without having to exit and select the next story manually.

Best regards,
Florian

1 Like

Mmm, got it, ok, not tested and not 100% if possible (can test it tomorrow) but from top of my head,

  1. I would show then the single story as a LIST also (where you filter from the Story you just selected and returning only 1 item).

  2. Add an autonumber (incremental) to each user story

when user is inside a story (being a single item list) when you click the “Back” button, it would redirect to another story screen but with a filter of the previous ID -1 (STORY ID - 1)

and if next, it would be (STORY ID + 1).

I will try and create a template tomorrow, as I also need it for my app. Hope at least gives you some ideas.

1 Like

Hi @Florian
Is this what you are looking for?

User: john@doe.com
pass: johndoe

The only caveat now that we have here, is if user deletes a story the counter stops, but when I have more time, I will check into that. If user does not delete stories, than it works fine like this.

Cheers

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.