Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Now supporting Dark Mode on LINE messenger

Now supporting Dark Mode on LINE messenger

Hitomi Komata (S_Shimotori)
LINE LINE iOS Team Software Engineer
https://linedevday.linecorp.com/jp/2019/sessions/S2-5

LINE DevDay 2019

November 21, 2019
Tweet

More Decks by LINE DevDay 2019

Other Decks in Technology

Transcript

  1. 2019 DevDay
    Now Supporting Dark Mode on
    LINE Messenger
    > Hitomi Komata (S_Shimotori)
    > LINE LINE iOS Team Software Engineer

    View Slide

  2. Dark Mode feature is coming soon!

    View Slide

  3. Agenda > What is Dark Mode for “LINE”?
    > Way to support Dark Mode
    > Future tasks

    View Slide

  4. What is Dark Mode

    for “LINE”?

    View Slide

  5. > Saving battery on OLED display
    > Less eye strain
    Dark Mode on iOS13

    View Slide

  6. LINE Theme “ண͔ͤ͑”
    “Black” & “Cony”

    View Slide

  7. What is Dark Mode for “LINE”?
    > A feature to change light or dark as you like
    > A burden on LINE’s multiple projects and technical debt
    CONFLICT: Merge conflict in Theme system.

    View Slide

  8. Way to support Dark Mode

    View Slide

  9. Legacy colors in “LINE”

    View Slide

  10. LDS semantic colors
    by LINE DESIGN SYSTEM
    primaryText #111111 / #FFFFFF
    secondaryText #555555 / #B7B7B7

    View Slide

  11. hardcoded

    static UIColor
    dynamic UIColor
    Color flow in “LINE”
    Theme

    setting file
    static UIColor
    LINE

    semantic color
    Force light mode
    temporarily

    View Slide

  12. iOS view hierarchy
    UINavigationController + modal transition
    UIWindow UITransitionView
    UINavigation

    Controller
    UIView

    Controller
    UITransitionView
    UIView

    Controller
    UINavigation

    Bar

    View Slide

  13. Fix for new methods in iOS 13
    > There is overlap between withTintColor(_:) and our tint method.
    > and so on.
    > UISearchBar’s specification is modified in iOS 13.

    View Slide

  14. Done!

    View Slide

  15. Future tasks

    View Slide

  16. Future tasks of LINE Theme
    > Update LINE Theme system and assets for LINE DESIGN SYSTEM
    > Remove hardcoded colors and enable LINE Theme

    View Slide

  17. Summary

    View Slide

  18. Summary
    > “LINE” supports Dark Mode feature,

    however some views are still forced in light mode in the first release.
    > LINE Theme continues to be updated!
    > Dark Mode feature is a part of Theme system in “LINE”.

    View Slide

  19. Thank You

    View Slide