Financial × Frontend: Approach to UX

Slide 1

Slide 1 text

2019 DevDay Financial × Frontend: Approach to UX > Eisuke Okuyama > LINE Financial WebDev Team frontend engineer

Slide 2

Slide 2 text

Agenda > About LINE Securities > Frontend Architecture > UX Approaches

Slide 3

Slide 3 text

About LINE Securities

Slide 4

Slide 4 text

About LINE Securities

Slide 5

Slide 5 text

Frontend Architecture

Slide 6

Slide 6 text

Jenkins Developer GitHub Pull Request Build / Test Notify Result Frontend Architecture

Slide 7

Slide 7 text

Jenkins Developer Run Frontend Architecture Build / Test Deploy Config Result

Slide 8

Slide 8 text

What We’re Using TypeScript Jest React

Slide 9

Slide 9 text

Approach to UX

Slide 10

Slide 10 text

How Do You Feel Financial Service? When You Hear

Slide 11

Slide 11 text

Boring? Difficult? Complicated?

Slide 12

Slide 12 text

We Should Make Positive All These Words

Slide 13

Slide 13 text

Fun! Easy! Simple!

Slide 14

Slide 14 text

> Register / Phone Number > Lottie-web for step animation Fun!

Slide 15

Slide 15 text

> How to buy stock > Only 3 screen transitions to order Easy!

Slide 16

Slide 16 text

> Simple line chart of stock price > Chart.js > (chart is test data) Simple!

Slide 17

Slide 17 text

And More…

Slide 18

Slide 18 text

> For Native Experience > Implemented by  web frontend technology Page Stack

Slide 19

Slide 19 text

> Back to previous screen by swiping Swipe Back

Slide 20

Slide 20 text

> Search > Change tabs by swiping Swipeable Tabs

Slide 21

Slide 21 text

We’re Improving Many Things!

Slide 22

Slide 22 text

Why Don’t You Join Us?

Slide 23

Slide 23 text

Thank You!