2021-04-01 Mobile Design Meeting notes

Date

Apr 1, 2021

Participants

  • @Adam Butterworth (Deactivated)

  • @Bronwyn Hawkins (Deactivated)

  • @Colin Brash

  • @Hilary Gordon (Deactivated)

  • @Mian Khalid

  • @Poornima Hanumara (Deactivated)

Goals

  • Align on how to use Paragon design system for mobile

Adam’s proposal

General ideas:

  • Use the foundations of Paragon including, typography, colors, and spacing.

  • Existing Paragon components built for the web will be considered in mobile viewports moving forward (making them usable if they appear in webviews).

  • Leverage OS patterns as much as possible.

  • Take an as-we-go approach to creating our own mobile components

Tactically

  • Create a Paragon Mobile Figma Library

  • Create a Mobile section in the design docs outlining general principles.

  • We will not create a iOS or Android component library project.

Open question

  • How might we align on what components already have been built in code?

Notes

  • Colin, backporting - it will probably be intuitive or it would be reusable enough that we shouldn’t worry about it. I don’t think it’s worth tackling it from code backwards into design. At least not for now.

  • What balance between navitve patterns vs custom should we strike?

    • Hilary - it’s fuzzy right now. Figma library is missing resources so that’s step one. There are some obvious decisions. Getting native figma components in our library would be helpful. Example: if we get to toggles let’s pull those into figma android and native and then make decisions as we go.

    • Colin - should we take screenshots of these things? is that enough?

      • Hilary - we should build it in Figma

      • Poornima - and for user testing it’s better if it’s a figma component

    • Should we diverge ios and android design

      • Hilary - we diverge now. Hard without a ddevice. Open to what people think. Was going to push us to something more consistent between app on both platforms.

      • Coliin - In general a good line here. Is Google and Apple design guidelines, we shouldn’t be breaking those for edX. Consistency would be outside those guidelines. As a user I hate when users make custom ui decisions that “break”

      • Poornima - User-testing specifically targeting android international users would be helpful here.

  • Colin has devices on the way for each designer (2).

  • Poornima - consistency between apps and mobile web? Not super urgent but something to keep an eye on.

    • AB: Web components today have some minimum touch target sn

  • Hilary - process for adding to the figma library? Is it the same as the web.

    • AB: Let’s not follow the standard process. This is a small team so let’s not spend time on alignment.

    • Bronwyn and Hilary to be owners of the Paragon Mobile figma library. Adam to support where needed.

  • Poornima and Colin - will add screenshots

  • Adam to add guideline around standard canvas size and pixel units. Colin - different aspect ratios as well. What are the constraints of objects on a page matters - apps are still semi responsive.

  • Hilary - Low fi side, how should figma library support mobile?

    • Adam -

    • Poornima - we could do grayscale of hifi components

  • Hilary - design action item. would like to still talk about process.

Action items

@Adam Butterworth (Deactivated) to schedule design process meeting wtih designers
@Poornima Hanumara (Deactivated)@Colin Brash add screenshots to Figma
@Adam Butterworth (Deactivated) to add proposal to a Mobile page inn DSD.
@Colin Brash to ask Khalid for async feedback.

Decisions