sketchbook

서초구 1인 1악기 앱
메타버스로 즐기는 온라인수업

Tag
UI/UX, App
Client
서초문화재단
Role
Design, Development
Links

OverviewSound of Seocho

‘1인 1악기’는 서초구가 주관하고 서초문화재단이 운영하는 문화예술교육 사업으로
코로나19 확산으로 인해 변화하는 교육환경에 탄력적으로 대응,
초등학생들의 온라인 음악교육을 보다 효율적으로 추진할 수 있도록
온라인 플랫폼을 구축하고자 하였습니다.

Client Needs

학생들이 온라인 악기수업을 보다 쉽고 재미있게 배울 수 있도록
사용이 편리하고 초등학생의 흥미를 끌 수 있도록 구축되기를 원했습니다.

Client Interview

1인 1악기 사업의 목적과 현황 및 제약사항 등을 파악하고
프로젝트 목표와 방향성을 결정하기 위해 서초문화재단측과 인터뷰를 진행했습니다.

Online Platform Plan


각 사용자들이 쉽게 이용하고 관리할 수 있는 플랫폼을 구축하며
주 사용자인 초등학생이 흥미를 느낄 수 있도록 재미 요소를 제공하도록 합니다.

Our Mission
  • 흥미로운 -재미요소를 통해 악기 수업에 대한 흥미 유발
  • 경험 극대화 - 가상세계를 통해 새로운 경험 제공
  • 쉽고 편한 사용 - 쉽고 편하게 사용할 수 있는 통합 관리 기능 제공

Target Analysis

1인 1악기를 통해 다양한 악기 체험 및 교육 기회를 제공하고
각 사용자들이 편리하게 이용할 수 있는 통합 플랫폼을 구축하는 것이 이번 프로젝트의 최종 목적입니다.
프로젝트 목적에 따른 타깃을 도출하였습니다.

  1. 1

    악기를 배우는
    초등학생

    초등학생의 눈높이에 맞는
    재미요소를 통해
    악기 수업을 즐길 수 있도록 함

  2. 2

    수업을 진행하는
    악기 강사

    학생들과의 원활한 소통과
    수업 관리를 위한 기능 제공

  3. 3

    강사와 학생을 관리하는
    학교 선생님

    수업 진행 전 과정에 대한
    프로세스를 고려한
    수업 및 강사 관리 기능 제공

Project GoalGOAL

1인 1악기 플랫폼에 초등학생의 눈높이에 맞는
흥미로운 요소와 인터랙션을 연출하여 즐거운 경험을 전달합니다.
1인 1악기의 활성화를 통해 악기를 배우는 학생들에게는 기존 딱딱한 교육 앱과
차별화 되는 재미있는 플랫폼으로, 강사에게는 학생들과의 자유로운 소통과 수업 관리를 위한 플랫폼으로,
학교 교사에게는 수업의 전 과정과 학생 및 강사를 관리할 수 있는 통합 플랫폼으로
각 사용자에게 쉽고 유용한 기능을 제공하는 것이 이번 프로젝트의 목적입니다.

Concept DesignConcept

메타버스를 활용하여 악기마을이라는 가상세계를 구축하고
각 사용자별 캐릭터를 설정하여 플랫폼을 더 즐겁게 이용할 수 있도록 합니다.

Concept image

Design System

앱의 완성도 높은 아이덴티티 구축을 위해 디자인 시스템을 정의합니다.
정의된 가이드는 사이트의 UI 뿐만 아니라 사용자와의 다양한 접점에 활용하도록 합니다.

baby Blue

#89d4f3

baby pink

#ffa1bd

Color

부드러운 파스텔톤 컬러를 사용하여
귀엽고 밝은 느낌을 연출합니다.

Typography

주 사용자인 초등학생을 고려해
둥글고 귀여운 느낌의 서체를 사용합니다.

  • CookieRun
  • 나눔스퀘어라운드
Graphic elements

1인 1악기 플랫폼에 들어갈 디자인 및 인터랙션 요소를 정의합니다.

Character
  • Character
  • Character
  • Character
  • Character
  • Character
  • Character
  • Instrument
  • icons
  • icons
  • Village map
    village
    • 1학교 & 음악분수

      악기마을 친구들이 음악을 배우는 학교에요! 쉬는 시간마다 학교 앞 음악분수에서는 멋진 음악이 흘러나온답니다.

    • 2둥둥섬

      무지개빛 폭포가 흐르는 신비의 섬이에요! 영감이 마구 떠오르는 이곳은 아리가 가장 좋아하는 장소에요.

    • 3악기동산

      악기로 만들어진 놀이기구가 가득한 동산이에요! 리니&라니 남매가 한 눈에 반해버린 곳이랍니다.

    • 4음악무대

      악기마을 친구들이 모두 모여 악기 연주 솜씨를 뽐내는 무대에요! 누구나 무대의 주인공이 될 수 있답 니다.

    • 5리니&라니네 집

      리니&라니 남매가 새로 이사 온 집이에요! 가끔 마을 친구들을 초대 해서 파티를 열기도 한답니다.

    Background

    reveal
    your
    existence REVEAL

    Main

    로그인 후 메인페이지로 학생들이 흥미를 가질 수 있도록
    캐릭터와 마을 배경을 사용하고 모션을 추가해 재미있게 표현했습니다.
    수업 카드를 직관적으로 구성하여 사용성을 높였습니다.

    Class main

    메인화면의 수업카드를 통해 수업방에 입장합니다.
    수업방은 해당 악기 수업의 진행률, 진행중인 수업, 자료 등으로
    구성하여 편리하게 이용할 수 있도록 하였습니다.

    Login

    로그인과 회원가입 화면에 캐릭터와 모션을 사용하여
    지루하지 않게 구성하였습니다.

    Mypage

    방을 컨셉으로 하여 마이페이지를 구성하였습니다.
    나의 수업, 나의 질문 등의 기본적인 항목에 나의 상장 콘텐츠를
    추가하여 학생들이 성취감을 통해 악기 수업을 재미있게
    느낄 수 있도록 합니다.

    Archives

    서초문화재단의 지난 활동을 확인할 수 있는 화면입니다.
    상단 배너에 일러스트 요소와 모션으로 전체 톤앤매너에 맞추어
    아기자기한 느낌으로 구성하였습니다.

    Notice

    공지사항을 확인할 수 있는 알림판입니다.
    직관적인 구성으로 편리하게 사용할 수 있도록 하였습니다.

    서초구 초등학생은
    메타버스로 악기를 배운다

    Credits

    1. Director

      • Baek GwangJong
    2. Product Manager

      • Kim SangHoon
      • Kang HyunKyeong
    3. Design

      • Han SeHui
      • Jeon EunJeong
    4. Development

      • Park BeomUn
      • Jeong JinWoong
      • Joo D.H
      • Race
      • Kang MinJu
      • Lee NaRa
      • Kang HyeSun