[MyMeta] Add the role selection screen to the profile creation flow

[peth-yursick]

Currently, role selection is done through a Discord bot. We want to add it to the profile creation flow (Connect button here).

We probably want new tables such as guild_role and guild_player_role to store these new roles. This should support guilds that have a discord integration as well as those that do not.

Ideally, choosing roles would also apply the appropriate Discord role. For this to work, we'd first need to know a player's discord ID, which we could ask for in a prior step.

[alalonde]

I assume the roles should be the same as those in discord? I'm refactoring the profile setup stuff currently for #278 so I'll tackle this once that is done.

[IxaBrjnko]

Let's see what the discussion brings on Sunday, it may be better to use a simplified set of roles for the onboarding process...

[alalonde]

Sounds good; I wasn't privy to the conversation so any links / details here would be appreciated.

[dysbulic]

Since there's going to be a Discord bot that knows what everyone's roles are (#184), should we also have it mirror roles to a Player's profile.

Specifying information in two places is a recipe for things getting out of sync.

[dan13ram]

I believe this should be worked on once we have discord oAuth implemented. Ref: https://github.com/MetaFam/TheGame/pull/446

[davort]

Will this need any design contribution?

[peth-yursick]

Will this need any design contribution?

Just a little bit! 😇 The page for selecting the role can be either pretty much the same as the color selection or player type selection screens, just different icons & text

[davort]

Will this need any design contribution?

Just a little bit! 😇 The page for selecting the role can be either pretty much the same as the color selection or player type selection screens, just different icons & text

In that case, please feel free to ping me about this issue whenever you feel is a good time for a designer to give their 2 cents 😉

[peth-yursick]

Will this need any design contribution?

Just a little bit! 😇 The page for selecting the role can be either pretty much the same as the color selection or player type selection screens, just different icons & text

In that case, please feel free to ping me about this issue whenever you feel is a good time for a designer to give their 2 cents 😉

Whenever! How about tomorrow? Could do it pretty much any time before the designers call or at the call

[davort]

Hey everybody! I'd like to start designing a solution. Before I begin, I want to make sure I am completely aware of all technical aspects. Is there anyone here who would be so kind as to bring me up to speed regarding the current state, possibilities and limitations? That said, do we already know who will be the builder assigned to this quest?

[alalonde]

We will be dynamically fetching the roles directly from Discord. So you can assume that they are the same as in the role-select channel. Other than that, I'm not sure what else you would need to know. Maybe just come up with a lo-fi design and get feedback before spending too much time on it?

[davort]

Thanks @alalonde

1. Will it work the other way around, too? When a player selects a role during profile creation, or when editing their profile on MyMeta, will that info be automatically pushed to Discord?

2. I will make a couple of quick lo-fi mockups and get back here for feedback/validation.

[alalonde]

I believe the intent is that the role selection channel / interface in discord will go away. It would be easier to implement that way, anyway. We will still pull the roles from there since it’s useful to be able to tag the guild e.g. @innkeeper

On Jun 16, 2021, at 11:15 PM, Davor Tomic @.***> wrote:

Thanks @alalonde https://github.com/alalonde Will it work the other way around, too? When a player selects a role during profile creation, or when editing their profile on MyMeta, will that info be automatically pushed to Discord?

I will make a couple of quick lo-fi mockups and get back here for feedback/validation.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/MetaFam/TheGame/issues/311#issuecomment-862932421, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAKWNVT6CVMOQ3EZXRT2MRLTTGAITANCNFSM4WXDIU5Q.

[davort]

Hey @alalonde & @peth-yursick (and others). Let's start with the end in mind, the desired outcome!

---

Note: Please absolutely ignore the styling of these "role pills" for now. Consider them placeholders, until we have sorted out some more important questions. For now, the question to think about is "WHAT exactly are we showing here?"

---

Currently, players can have many roles in Discord. Please check out this quick mockup 👇 It shows all Penguin's roles from Discord.

It would be a huge help if you could answer these few questions, before I proceed:

1. Are we aiming to show all roles that a player has in Discord, on their profile page, too?
2. If the answer to the above is "no" → can you specify which, and how many roles should be displayed on the profile page?
3. Feel free to add anything you think might be useful info in this context, thanks!

[peth-yursick]

Hey @alalonde & @peth-yursick (and others). Let's start with the end in mind, the desired outcome!

Note: Please absolutely ignore the styling of these "role pills" for now. Consider them placeholders, until we have sorted out some more important questions. For now, the question to think about is "WHAT exactly are we showing here?"

Currently, players can have many roles in Discord. Please check out this quick mockup 👇 It shows all Penguin's roles from Discord.

It would be a huge help if you could answer these few questions, before I proceed:

1. Are we aiming to show all roles that a player has in Discord, on their profile page, too?

2. If the answer to the above is "no" → can you specify which, and how many roles should be displayed on the profile page?

3. Feel free to add anything you think might be useful info in this context, thanks!

I think definitely no. Even at MetaGame people can have that many roles, and this will be querying their roles from all the discord servers they are members of that are guilds as well.. I think both the roles & skills should be limited. For roles, I'd say where the "ARTIST" is, there should be "primary" & "secondary" roles with an arrow below or something for an "all roles" expansion, dropdown, popup or whatever. As for skills, we talked about categorizing them & having a few more prominently displayed long time ago. We haven't defined it very well, but an issues has been open for a long time: #441 We could go with something simple like having "top 3 skill" or go for something cooler like splitting them into "major", "minor" & "misc" skills with 3 each + "see all" for "miscellaneous" but let's keep that side of the discussion in #441

[alalonde]

I think we should scope this discussion to the original goal: To move the role selection interface from discord to mymeta. Let's create a separate ticket for how to show role information once a role has been selected.

Currently, for new players: They go to the "role-select" channel and respond to the original post with an emoji representing a role. After this ticket is finished: The aforementioned discord channel / post goes away, and instead, during setup, they select a role.

Is this the expectation @peth-yursick ?

[davort]

@alalonde I fully agree that these are two different issues. And to that point, this was my attempt to scope the discussion to the original goal. I was hoping to save us all some time with that.

The idea with "starting from the end", and thus showing this mockup, was to determine what exactly will the user be selecting during the setup process? Will it be just one role? Or will they be offered to choose two, or even more roles, during the setup process?

Should we stick with what's there in Discord, and allow people to choose however many roles they wish? There are 18 roles in total to choose from, as of today.

And then, what happens with people—like Penguin in this example—who have 10+ roles, some of which they earned and can't normally be chosen? Does it make sense to show them all in their MyMeta profile, as well?

Once we agree on where we want to end up, we can start charting an optimal path to that destination. Happy to hear your thoughts on that.

[peth-yursick]

I think we should scope this discussion to the original goal: To move the role selection interface from discord to mymeta. Let's create a separate ticket for how to show role information once a role has been selected.

Currently, for new players: They go to the "role-select" channel and respond to the original post with an emoji representing a role. After this ticket is finished: The aforementioned discord channel / post goes away, and instead, during setup, they select a role.

Is this the expectation @peth-yursick ?

Yep!

Should we stick with what's there in Discord, and allow people to choose however many roles they wish? There are 18 roles in total to choose from, as of today.

When we were originally talking about this, we were thinking about filtering it down to way less. I think this is a good idea. The role select channel itself needs a big cleanup as it was mainly supposed to be giving people an overview of what they could be doing & picking roles doesn't mean they are actually doing them.. I'd start with these basic: Artist, designer, builder, innkeeper, writer, shiller & patron - anything else is either combination of these, a specialization &/or a specific skill 🤷‍♂️ If we want more, we could add: Headhunter, bridgebuilder & rogue, but imo headhunters & bridgebuilders are mainly innkeeperXshiller and most active people are rogues anyway.

And then, what happens with people—like Penguin in this example—who have 10+ roles, some of which they earned and can't normally be chosen? Does it make sense to show them all in their MyMeta profile, as well?

I think discord should actually be the source of truth, so roles from discord should automatically appear on MyMeta as well. Which is also why the profile creation should allow only the basic public roles. Can't select a "player" role - which is what actually indicates whether you're a player of MetaGame or just someone who created a MyMeta profile.

[davort]

Thanks @peth-yursick - I believe I have enough now to move forward with this!

[alalonde]

I think discord should actually be the source of truth, so roles from discord should automatically appear on MyMeta as well. Which is also why the profile creation should allow only the basic public roles. Can't select a "player" role - which is what actually indicates whether you're a player of MetaGame or just someone who created a MyMeta profile.

Some of these Discord "roles" are unique to discord, so it probably doesn't make sense to show all of them. E.g. Server booster and Moderator. Maybe it doesn't matter for this first version though.

[davort]

Hi guys. Thank you again for your input.

I summarised it all in a "brief", which you can find here: Role selection (Notion) → I would appreciate it if you could take a look, and let me know if it all makes sense, or if something needs changing. Thanks in advance.

[chair28980]

Hi guys. Thank you again for your input.

I summarised it all in a "brief", which you can find here: Role selection (Notion) → I would appreciate it if you could take a look, and let me know if it all makes sense, or if something needs changing. Thanks in advance.

@davort thank you for the thorough brief, makes sense to me!

Question for everyone: Do we have corresponding backendy-type discord bot issues for the functionality mentioned here?

[chair28980]

@alalonde I would love to halp with the discord bot stuff to get more familiar with whats happening I have bit of war wounds with discord bots.

[davort]

@alalonde I would like to hear your opinion re: feasibility of the following two design approaches. Also, @peth-yursick re: look & feel, overall vibe, etc.

1. Two separate lists I found these laying somewhere in the middle of an old Figma file. My guess is that markop had designed it, back in the day. Basically, two separate lists, and a bit of modal action.

2. Carousel, with tabs and role character illustrations An idea that seemed like an opportunity to infuse a bit of gaming feel into it, and thus make it a bit more delightful. Would require acquiring the illustrations for all roles, and I'd need to work a bit more on the details for the UI. But in general, you can pick only one main role, and a number of secondary ones. Any more details you'd need to know before being able to give your assessment(s)?

The main question here is, is there a clear winner in terms of feasibility between these two? Which direction to pursue?

[alalonde]

I don't see either being much more difficult than the other, either one is a custom component.

[peth-yursick]

1. might be better from the ux perspective if we're allowing people to pick for their secondary role any role they have on any guild discord server as there might be a lot of them

edit: off the wall idea, feel free to ignore & continue with 1. or 2. What if it was a grid instead? Would be easier to display many roles but still keep gaming feel because it would be basically like picking a character in multiplayer fighting games. A highlighted square on hover, click once to lock in primary, keep moving & click on another to lock in secondary.

[davort]

Thanks @peth-yursick - funny thing, the grid approach was something I'd explored as the very first idea 😊 Here's a finished prototype of what I hope will be an intuitive role selection UI: Role Selection - Figma prototype

And here's a recording of the prototype in use, should you prefer that over the prototype: Role Selection Flow - Recording

@alalonde - would you say this would be a feasible solution? If you both see this as a viable idea, I would pass it through the #feedback-box on Discord.

[davort]

We have successfully validated the prototype, and here's the report. This is now ready for implementation. Who might be able and willing to help build this?

[peth-yursick]

We have successfully validated the prototype, and here's the report. This is now ready for implementation. Who might be able and willing to help build this?

Maybe @alalonde after he's done with the guild onboarding bot as its a pre-requisite anyway afaik

[alalonde]

Let's do this! Just caught up with all the requirements. Here is my plan of attack:

1. Write a hasura migration to populate a discordVisibleRoles array within the discord_metadata table.
2. Add a custom action that fetches the roles from discord (since the discord_metadata table is private)
3. Add a player_roles table. This will include a rank int column to specify primary vs secondary. Ideally we could just fetch the discordVisibleRoles from the MetaGame discord server which the player has, and not store the data anywhere. However, MyMeta is now the source of truth for these roles and will control them. Thus, we will not bother to sync discord roles updates into MyMeta.
4. Add a custom action saveMetaGameRoles which will take the selected role and populate player_roles accordingly, as well as adding/removing the appropriate roles in Discord
5. Add the new “select roles” component and hook it up to the new action.
6. Enhance the player profile page to pull in these roles and display them

[alalonde]

A few outstanding questions / comments:

1. Which step will this be in the setup profile flow? Currently it is username / personality type / player type / skills / availability / time zone / memberships
2. When importing existing roles from discord, how we will determine the "primary" role? I suppose we can just pick the highest-ranked one, but if a primary role is required, it seems we need to choose one.
3. What happens if you click the already-selected "primary" role while choosing secondary roles? What if you change your mind while selecting secondary roles and want to change the primary role?

[davort]

Hey @alalonde - great to see you as the designated builder for this one! 🙌 And right off the bat, you asked great questions. I'll answer the best I can.

1. Which step will this be in the setup profile flow? Currently it is username / personality type / player type / skills / availability / time zone / memberships

IMHO it might be best placed between "skills" and "availability", since the role(s) will probably be chosen based on skills a player possesses. This way, it feels as if the flow would be uninterrupted. Let me know what you think.

2. When importing existing roles from discord, how we will determine the "primary" role? I suppose we can just pick the highest-ranked one, but if a primary role is required, it seems we need to choose one.

It's a great question. I don't have the technical depth required to offer a good answer. However we end up automating this process, there is a chance it won't go perfectly for everyone. I'd say let's do whatever seems the most feasible. Whatever we decide to do, let's ping everyone after it's done, encourage them to go check their profiles, so they can make adjustments if necessary. Let's also add that info to the newsletter, for those players who'll have missed it on Discord.

3. What happens if you click the already-selected "primary" role while choosing secondary roles? What if you change your mind while selecting secondary roles and want to change the primary role?

Great catch! This is definitely the part that's missing. I'm thinking of adding controls—buttons—to enable (A) deselecting a role, and/or (B) switching their weights, respectively. This should work nicely on all screen sizes, once I have designed this for mobile, too.

All in all, still some work to be done. I will see that I come back with concrete ideas for questions 1) and 3) ASAP. This is exactly what I needed in order to continue working on this, so thanks again for joining in on this issue!

[alalonde]

@davort I think the only thing missing from this is a way to re-order your secondary roles. I believe we wanted to support multiple ones, no?

[alalonde]

^ This may just be an implementation detail, but in the Database there's no concept of a "type" of role, just a role with a rank. So #1, #2, etc, which makes us able to easily order them when displaying.

[davort]

@davort I think the only thing missing from this is a way to re-order your secondary roles. I believe we wanted to support multiple ones, no?

I am not 100% at this point in time, but we'll find out 😉 In case it is as you say, we will re-use the "Edit order" UX pattern that we're right now solving for #441 — it will most likely work similar to this (note: action begins 5 seconds into the video)

https://user-images.githubusercontent.com/1573304/134300738-2828f18b-7500-4918-9d79-03f8267fa477.mp4

I believe we can pull it off with no issues. Also, this is both accessible and allows us not to have to invest time into fiddling with drag-and-drop. So yeah, it will only be a matter of adding that pattern to the final design.

[davort]

Hey @alalonde – was just wondering what's the status of this issue? Actually, want to make sure that design isn't a blocker, before anything else. Please let me know if it is, or if I can help in some other way.

[alalonde]

No, I've just been away from MG building for a while... jumping back in now