재외동포 국내외 교류 선도기업,
OKFriends 웹 페이지 개발
BUILD
WEB / MOBILE
OKFriends
웹 페이지 개발
- Client
- OKFriends (재외동포 대학생 온라인연수)
- Date
- 2021. 05 - 2021. 09
- Type
- 홈페이지, 워드프레스, 반응형 구축
Overview
OKFriends의 최상위 홈페이지 목적은 “안정적인 서버설계” 이었습니다.
재외동포 대학생의 홈페이지 접속 환경을 어디에서든 안정적으로 접근이 가능하도록 서버 설계를 진행했어야 했습니다. 또한 템플릿형 UI / UX디자인에서 벗어난 맞춤형 디자인 & 마이크로 인터렉션을 선보였습니다.
Goal
안정적인 서버 설계
UI/UX Strategy
반응형 웹
반응형 웹에 최적화된 레이아웃과 그리드를 사용해
다양한 환경에서 사이트를 이용할 수 있도록 사용자 편의를 고려하여 제작하였습니다.
다양한 정보를 아우르는 UI
OKFriends의 방대한 정보와 제품을 위한 공통적인 가이드가 필요하였습니다.
통일된 그리드와 컴포넌트를 활용하여 UI 가이드를 제작하였습니다.
부드러운 인터랙션
사용자의 스크롤에 따라 자연스럽게 움직일 수 있도록 인터랙션을 적용하였습니다.
OKFriends
Design System
전체적으로 세련되고 현대적 스타일의 고딕체로 스마트폰 및 태블릿 같은
작은 화면의 디바이스에서도 텍스트를 보다 쉽게 읽을 수 있도록 가독성을 고려했습니다.
색상은 브랜드의 color system을 사용해 통일성을 제공합니다.
Typography
Noto Sans
Noto Sans KR
Color System
2021 재외동포 대학생
온라인 모국 연수
익숙한 UI디자인을 제공하는 제이콥의 법칙
강의사이트를 사용하는 홈페이지 사용자에게 그들의 경험과
최대한 비슷한 UI디자인을 제공하여 홈페이지를 사용하는데 큰 불편함을 없게 기획하였습니다.
OKFriends
Subpage
1st LECTURE INTRODUCTION PAGE
OKFriends의 홈페이지 사용자가 원하는 정보를 기입하여
그들의 Needs를 충족시켰습니다.
‣ 온라인연수 소개 페이지
2nd LECTURE INTRODUCTION PAGE
OKFriends의 홈페이지 사용자가 원하는 정보를 기입하여
그들의 Needs를 충족시켰습니다.
‣ 온라인연수 소개 페이지
LIBRARY PAGE
재외동포를 위한 대한민국의 자료를 모아놓은 아카이브로
홈페이지 유입을 확대시키는 역할을 도맡았습니다.
‣ 도서관 페이지
OKFriends
Mobile Page
완벽한 WEB / MOBILE 반응형 대응
모바일에서도 텍스트 & 사진이 깨지지 않는 반응형 대응 작업을 진행해
PC와 마찬가지로 자연스러운 영상 시청이 가능하도록 만들었습니다.
