나도 언제부터인가 키오스크에 대한 두려움이 생기고 있다. 특히 키오스크로 주문하고 있을 때, 누군가가 뒤에 줄을 서 있을 때 두려움이 더 더욱 크게 발생한다.

 처음 특정 상점의 키오스크를 마주하게 되면 빠르게 이 키오스크의 사용법을 확인해야 한다. 그런데 이 놈의 키오스크가 통일된 UX가 있는 것이 아니라서 눈에 익숙해지는데 충분한 시간이 필요하다. 가끔은 키오스크들이 알 수 없는 동작들이 추가되기도 한다. 그 때는 이것을 만들 때 전문적인 UX디자이너의 의견이 반영된 것인지 아니면 특정 임원의 의견이 반영된 것 아닌지 하는 의심이 들기도 하다.

 나이가 많은 사람이 키오스크에 대해 어려움을 겪는게 UX문제로 보일 때도 있다. 사용법을 익혀서 키오스크를 사용해야 된다면 뭔가 잘못된 것 같다.  

 언젠가 부터가 현재 상태를 알 수 없는 UI 들이 등장하기 시작했다. 

알림톡이 처음 오면 활성화 되는 버튼 상태

알림톡 받지 않기를 선택하면 알림톡 받기라는 버튼으로 변경된다. 

알림톡을 받지 않기 상태일 때 알림톡 받기로 버튼이 변경된다.



이게 도대체 내 상태가 알림톡 받기 상태인지, 아니면 버튼을 누르면 알림톡 받지 않기 인지 전혀 알 수 없다. (물론 아래 설명을 읽어보면 알 수 있다. 그런데 나중에는 맨 위로 스크롤 하지 않는 한 해당 설명을 다시 읽을 수 없다.그 때는 내가 알림톡 받지 않기를 눌렀는지 아니면 눌러야 되는 것인지 전혀 알 수 없다. )

어느 순간 부터 내 상태 설명이 빠지고 버튼이 누르면 동작하는 방식만을 설명하는 form field가 생겨났다. 이게 기존 경험이 없다면 어떤 동작인지 전혀 알 수 없다. 뭔가 설명이 필요하다면 좋은 UX라고 할 수 있을지 모르겠다. 

https://googlefonts.github.io/korean/


https://github.com/googlefonts/korean



한글 폰트의 경우 영어폰트와 다르게 글자수가 많기 때문에 파일크기가 크다. 웹폰트의 경우 이 경우, 부담으로 작용하기도 한다. 

그래서 나눔고딕 가볍게 만들기(http://yiunsr.tistory.com/714?category=514016) 같은 식으로 한자를 빼고 폰트를 따로 만들기도 한다. 그런데 이 경우에도 꽤 폰트가 크다. 


Google 에서 이러한 문제를 해결하기 위해 

"Google Fonts는 머신 러닝에 기반을 둔 최적화 기술을 통해 한글 폰트를 동적으로 분할 다운로드합니다."

의 방식을 적용한다. 


서버가 nodejs 방식인데 그냥 샘플인 것인지 아니면 지금은 nodejs 만 가능한지 확인은 좀 필요할 것 같다. 




몰랐는데 어느 순간 구글에서 지원하는 한글 웹폰트가 크게 늘었다.

https://fonts.google.com/?subset=korean



이제는 무료로 사용할 수 있는 웹폰트의 선택 범위가 많이 넓어진 것 같다. 



덧붙이는 글 : 

아, 이건 CSS 만 넣으면 back단의 언어와 상관없이 동작하는 것 같다. 


<link href="https://fonts.googleapis.com/css?family=Gothic+A1:100" rel="stylesheet">

이런식으로 넣으면 CSS 가 붙는데, 

CSS 안에 

@font-face {

  font-family: 'Gothic A1';

  font-style: normal;

  font-weight: 100;

  src: local('Gothic A1 Thin'), local('GothicA1-Thin'), url(https://fonts.gstatic.com/s/gothica1/v2/CSR74z5ZnPydRjlCCwlCCMcvCvF0oo9KYQ_JRW8eai-QrZf9ge_IDOHzsAOH2x6vleKMTplt.0.woff2) format('woff2');

  unicode-rang


이런 식으로 unicode-range 가 정의 되어 있다. unicode-range 때문에 글자가 부분분적 잘 가져오는 것으로 보인다. 

여기서 중요한 것은 이 unicode-range 가 머신 러닝에 기반을 둔 최적화 기술이라는 것이다.