sketchbook

Hanyang
Cyber University

Tag
대학교, Metro UI, 개인화 개발
Client
한양사이버대학교
Links

Project overview

한양사이버대학교는 국내 1위 사이버대학교로서 온라인 고등교육의 발전을 위해 나아가고 있습니다.
개교 20주년을 맞이하여 홍보 및 브랜드를 강화하고,
사용자의 편의성을 증대시키고자 대표 홈페이지의 개편을 진행하였습니다.

Client Needs

한양사이버대학교 측에서는 다양한 계층을 고려한 디자인, 모바일 환경에서의 사용성 강화, 차별화된 기능 등을 바탕으로
한양사이버대학교만의 아이덴티티를 반영하여 경쟁력을 제고하고자 하였습니다.

비대면 교육
트렌드를 이끌어가는
한양사이버대학교

다양한 타겟층을 고려한
포괄적 디자인

타 학교 사이트와의
차별화된 기능 제공

  • 학부 예비 신입생

    학사일정이 자유로운가?
    대학생활은 어떨까?
    지원 프로그램은 어떤게 있을까?

  • 학부 재학생

    개강날짜/수강신청 날짜가 언제였지?
    내 성적으로 장학금을 받을 수 있나?
    학기 중에 내가 지원할 수 있는 프로그램이 있나?

  • 대학원 예비 신입생

    학사일정이 자유로운가?
    강의 구성일 좋을까?
    졸업요건은 어떻게 될까?

  • 대학원 재학생

    개강날짜/수강신청 날짜가 언제였지?
    내 성적으로 장학금을 받을 수 있나?
    학기 중에 내가 지원할 수 있는 프로그램이 있나?

각 사용자 그룹별 니즈를 충족시킬 수 있는 콘텐츠를 쉽고 빠르게 접근 가능하도록 하며,
커스터마이징 기능으로 재미를 더하고 사용성을 높이고자 합니다.

Project goal A space just for you

한양사이버대학교의 홈페이지는 온라인 캠퍼스 역할을 합니다.
입학을 꿈꾸는 예비 신입생에게는 나에게 꼭 필요한 학교라는 점을,
재학생에게는 나만을 위해 맞춤형 교육 환경을 제공해준다는 점을
다양한 콘텐츠와 커스터마이징 기능을 통해 전달하도록 합니다.

Strategy

사이트의 목적과 주 사용자에 따라 콘텐츠와 디자인 리뉴얼 전략을 설정합니다.

  • 1Contents

    사용자 맞춤 콘텐츠를 제공하기 위해 예비 신입생과 재학생으로 나누어
    콘텐츠 전략을 설정했습니다.

    학부·대학원 예비 신입생

    예비 입학생들이 궁금해할
    콘텐츠 중요도에 따라
    배치와 크기를 고려하여 구성

    전공소개, 학사안내, 학사일정, 논문, 공통 공지사항, 이벤트 게시판

    학부·대학원 재학생

    대학생활 스타일에 따라
    커스터마이징 가능한 편집 기능 제공하여
    사용성에 초점을 맞춤

    학사안내, 학사일정, 공지사항, 이벤트 게시판, 개인화 위젯

  • 2Design

    Metro UI를 사용하여 깔끔하고 절제된 무드로 표현하고
    모바일 환경에서의 확장성 및 사용성을 향상시킬 수 있도록 합니다.

    Metro UI

    Metro UI를 사용하여
    깔끔하고 절제된 무드 표현

    HYCU Identity

    한양사이버대학교의
    사각 그리드 아이덴티티 차용

    Module

    정보에 집중할 수 있는
    직관적인 모듈 구성

Design
System

Color

한양사이버대학교의 아이덴티티 컬러인 라이트 블루컬러를 메인으로 하며
딥블루, 딥퍼플의 컬러를 서브컬러로 하여 카드 구성 시 조화롭게 어우러질 수 있도록 합니다.
모든 컬러는 웹접근성을 고려하여 흰색의 텍스트와 조화 시 고대비가 적용되는 컬러로 설정하였습니다.

HYCU Light Blue #009de8, HYCU Deep Purple #5b28be, HYCU Deep Blue #2f35b7

Typography

산세리프체를 사용해 콘텐츠의 가독성을 극대화하여 표현합니다.
서체의 일관된 사용으로 사용자에게 메시지를 효과적으로 전달합니다.

Pretendard

Icon

메인 페이지에 배치되는 각 카드에는 메뉴를 표현하는 아이콘을 활용합니다.
심플하고 직관적인 아이콘으로 한 눈에 알아볼 수 있도록 하였습니다.

New
HYCU

Main

비로그인 메인페이지의 경우 입학을 유도할 수 있도록
콘텐츠의 우선순위에 따라 배치하며 정돈된 레이아웃을 사용하여
직관적인 스타일로 구성합니다.

Login home

로그인 시 재학생에게 필요한 메뉴 카드만으로 구성이 변경됩니다.
편집을 통해 맞춤형 메인페이지로 커스터마이징 할 수 있도록 하여 재미와 사용성을 더했습니다.

Edit mode

편집모드를 통해 카드를 이동, 삭제, 추가하여
나에게 딱 맞는 ‘마이홈’을 생성하도록 합니다.
커스터마이징 기능으로 타 학교 사이트와 차별화된 기능을
제공하며, 홍보 요소로서도 활용될 수 있도록 합니다.

Sub layout

기존 서브페이지의 콘텐츠는 유지하되, 리뉴얼된 메인페이지에 맞게
톤앤매너 및 레이아웃을 변경하였습니다.

Mobile

모바일 환경에서도 편리하게 콘텐츠를 확인할 수 있도록 구성하였습니다.

Graduate school

20th Anniversary

20주년 기념 백서의 아이덴티티를 담은 홈페이지를 구축했습니다.
앰블럼의 두 줄의 모티프를 홈페이지에 담아 표현했습니다.

Hanyang Cyber University

Credits

  1. Director

    • Baek GwangJong
  2. Product Manager

    • Kang YuMi
  3. Design

    • Han SeHui
    • Jun EiAn
    • Kim SuBin
  4. Development

    • Race
    • Lee NaRa
    • Baek GwangJong
    • Choi SeungCheol