Zcash wallet (design kit)

I’m releasing a design kit for Zcash mobile wallets today. The kit includes payment screens, staking (concept designs), simple messaging, contacts and unified addresses. Shielded assets — coming soon.

These designs are open source. Feel free to use them in your apps if you’d like!

I should mention that I haven’t designed error states or edge cases. I can eventually design those, if needed. Just let me know what you need and I’ll eventually get around to it.

Video

Prototype

Figma design assets

:beers:

18 Likes

Nice work!

Any plans to collaborate with ZF Grants - Elemental ZEC – Zcash UI Component Kit and Payment Processor @1337bytes? Would be cool if this was hosted on https://z.cash at some point maybe with Storybook.

4 Likes

Thanks!

No plans at the moment. It would be awesome to have some good mobile components for this stuff with nice UX. :+1:

3 Likes

Video

5 Likes

Hi, I love these designs! Thanks for publishing them, and for open-sourcing them. Would be great to have an MIT License or something in the Figma design, or on a GitHub repo for extra clarity on the open-source licensing in case people decide to publish an app using these designs.

I’m working on porting these designs to cross-platform React code, as one of the example projects for Elemental Zcash. Here’s an export with react-sketchapp: Sketch – Ziga Wallet Design Example and source code: https://github.com/elemental-zcash/react/blob/main/packages/design/src/screens/wallet/HomeScreen.tsx .

I’ll work on extracting the components and styling into an Elemental Zcash theme and create a React Native boilerplate so that people can play around with building an app with this, and I’m hoping that the ZecWallet Lite React Native code can be modularised so that these designs could be used together with the ZecWallet Lite mobile app internals.

6 Likes

This is great news @1337bytes.

Looking forward to seeing what you do with it!

I added a license to the Figma file.

7 Likes