Safe-react: Multisig Migration

[lukasschor]

What is this feature about? (1 sentence)

As a old Multisig user, I want to mirror the owner structure of my existing multisig on a safe so that I can reduce the switching effort.

Why is it needed? What is the value? For whom do we build it?

We have a significant userbase using the old Gnosis Multisig contracts & interface. We want to make it as easy as possible to switch to the Gnosis Safe for Teams.

High-level overview of the feature

Feature that allows to setup a Safe with the same properties as an existing multisig. Mid-sized banner at the top of the site (or even a full-screen pup-up) that explains that there is a successor to the Multisig Wallet (=Gnosis Safe for Teams) which has the following benefits:

• Future Proof: Add custom features using the modular design of the Gnosis Safe.
• Formally verified: While our code is always audited, we’ve gone one step further and formally verified the Gnosis Safe smart contracts.
• Save on gas: The Gnosis Safe for Teams is built with gas-efficiency in mind.
• Web3Connect: Connect with the Gnosis Safe for Teams with a wide range of popular wallets.
• User Experience: Interacting with a Multisignature Wallet has never been easier.

Three buttons "Dismiss" (close banner/pop-up), "Read more" (link to safe.gnosis.io/teams) and "Migrate wallet" (link to Safe for Teams onboarding with pre-populated information.

Clicking the button "Migrate wallet" would forward to Gnosis Safe for Teams > Create New Safe > Review with (1) Safe Name, (2) Owner addresses + Owner Names and (3) Threshold already populated (taken from current Multisig).

Clicking the button "Dismiss" would dismiss the banner/pop-up for this session. There should also be a checkbox "Don't show this again" that would (after clicking "Dismiss") not show the banner/pop-up when the app is opened in the future.

[lukasschor]

@giacomolicari This is also going to be relevant for you. Implementation is planned for late October / beginning of November, but feel free to already give feedback now or during the design stage.

[giacomolicari]

Sure @lukasschor , I can give feedback on this :)

[posthnikova]

Popup:

Popup with checkbox checked:

"Migrate wallet" button leads here:

[lukasschor]

Looks great. 👍

Another approach would be to already design the pop-up in the Safe for Teams design language to make a contrast to the current design language and hint towards the improved UX/UI. I'm definitely not saying this would be necessarily better, as it comes with its own drawbacks (e.g. it wouldn't look as "native" as it looks right now). But curious to hear your thoughts on this. @posthnikova

[KristinaMayman]

I think it makes sense to have the Multisig popup look native, but maybe there can be a more prominent link with something like "Check out the new look!"? I think "Read more" sounds a bit tedious, it would be good to have something where the user can just get a quick look.

Also, is there a reason why "Dismiss" is so prominently highlighted as a button and "Migrate wallet" not at all? Is that just to be in line with the Multisig design? If not, I would change that.

Small typo in the Safe for Teams design: it should be "Make sure you have 0.00041..."

[posthnikova]

@lukasschor @KristinaMayman I chose native style because it's less obtrusive and to reuse styles from Multisig design would be faster. If it doesn't work, we should show new styles more prominently.

I think "Read more" sounds a bit tedious, it would be good to have something where the
user can just get a quick look.

I just realised it goes to Safe website and there is not much more new information than in the popup, the same advantages are listed. There's no way to migrate wallet when you're on the Safe website so maybe we should not link there.

Also, is there a reason why "Dismiss" is so prominently highlighted as a button

This is the style used everywhere in Multisig. I would definitely show a more prominent "Migrate wallet" button

[posthnikova]

UX sync:

• do a blog post
• make button more prominent, rename "Setup" or "Create Safe"
• Read more leads to blog post
• Mention that they have to move funds

[posthnikova]

Changes after UX sync: button renamed to "Create new Safe", added a mention that they have to move funds to the new Safe. "Read more" leads to blog post. We need a blog post explaining how to migrate and a way to migrate from the Safe website.

[lukasschor]

I would rephrase the last section to...

Migrating couldn't be easier:
1) Click the button below to create a Safe with the exact same owner and signature policies as your existing Multisig.
2) Try out the new interface and learn about the many benefits.
3) As soon as you feel comfortable, start moving funds to your new Safe.

[KristinaMayman]

I like the rephrasing, yes. The only thing is that from the first point it's unclear whether clicking the button would allow me to copy the owner policies myself or if that would be done automatically. So maybe something like "Click the button below to create a Safe. Your current owner and signature policies will be applied to it automatically."

[posthnikova]

@lukasschor @KristinaMayman Text changed.

[lukasschor]

Looks good to me now.

@giacomolicari What do you think?

[giacomolicari]

I'm fine with it :) The only thing I would maybe change is that text Migration couldn't be easier: etc.., I'd make it bigger to emphasize how the migration process work and which steps users have to take. What's your opinion? @lukasschor

[lukasschor]

Agree, maybe we could make „Migration couldn‘t be easier“ as a title and also work with icons (1, 2, 3) and change the ones for the benefits to roman numbers or to symbols. Also, user experience has shown that gas efficiency is not really a big benefit for existing users, so I would leave it out.

[posthnikova]

UX sync: Make "Migration couldn't be easier" bigger, remove 1-2-3 circles from top list, add 1-2-3 numbers to migration process, remove benefit 5

[posthnikova]

Changes after UX sync @lukasschor @giacomolicari

[lukasschor]

Looks good. Moving this to Dev Backlog. 👍

[lukasschor]

@giacomolicari So from my side everything is fine and you could start implementing this feature. When do you think you will have time to work on this?

[giacomolicari]

Hi @lukasschor ,
I'd have a question about the flow. Do we show a migration modal for each wallet in the multisig app or just one for all wallets?

[lukasschor]

I would show it every time any wallet is opened until the user ticks „don‘t show this again“. Even though that would mean that they would see this modal even after migrating a certain wallet. But if it annoys the user, he could always click that box.

The assumption is that as soon as they migrated one wallet, users would be able to just replicate others from the Safe interface. But in case that‘s not correct we might have to add an additional „Migrate to Safe“ button in the interface header or similar.

Do you think that makes sense?

[giacomolicari]

Yes I understand. My only concern is about data we have to send from the Multisig app to Safe's endpoint. I understand I have to collect some data from the wallet, like list of owners and wallet's address.
In case a user is on the index page, we would send the whole list of multisigs a user holds, like:

[
   {
      "name":"Multisig 1",
      "address":"0x.....",
      "owners":[
         {
            "name":"Owner 1",
            "address":"0x...."
         },
         {
            "name":"Owner 2",
            "address":"0x...."
         }
      ]
   },
{
      "name":"Multisig 2",
      "address":"0x.....",
      "owners":[
         {
            "name":"Owner 1",
            "address":"0x...."
         },
         {
            "name":"Owner 2",
            "address":"0x...."
         }
      ]
   }
]
````

instead, if the user is on a wallet's detail page, we would send just data related to that wallet

[
{
"name":"Multisig 1",
"address":"0x.....",
"owners":[
{
"name":"Owner 1",
"address":"0x...."
},
{
"name":"Owner 2",
"address":"0x...."
}
]
}
]
```

Could you also provide me with the Safe's endpoint and what kind of http request to send? (GET, POST)

thank you @lukasschor

[lukasschor]

I understand. This modal would only show on the wallet detail page, as we can only migrate one wallet at a time.

@germartinez could you provide Giacomo with the information above?

[germartinez]

There is no endpoint needed for this feature.
We should create a link in the Multisig pointing to the Safe creation form in the Safe for Teams (gnosis-safe.io/open) and passing the required data from the Multisig in a way that the Safe creation form in can be filled automatically.

The data required in the link is:

• name (Safe name)
• threshold (Safe threshold)
• owneraddresses (Array of the owner addresses)
• ownernames (Array of the owners names in the same position as the owner addresses)

gnosis-safe.io/open?name=<name>&threshold=<threshold>&ownernames=<address1>,<address2>,<address3>&ownernames=<owner1>,<owner2>,<owner3>

[lukasschor]

@germartinez Because currently we do not allow users to create a Safe without an active wallet connection, we show this screen if the wallet gets disconnected in the creation flow. Does this cause any issues for this migration feature? Because the user would land on the interface and first have to connect a wallet but we should definitely not show this blank screen.

[germartinez]

Right now, that would be the behaviour. The URL would still have the data, so whenever the provider is connected, the form would be shown automatically with all the data.

[lukasschor]

@giacomolicari For the public launch we will rename the Safe for Teams to "Gnosis Safe Multisig". So there are two changes needed in the text of the migration screen.