6
반응형 웹디자인 기획서_일민미술관 Responsive web design Planning document_Ilmin Museum of Art 기획자 : 박성준 기획일 : 2017. 09. 16 목차 01. 기획의도 02. 필요성 인식 및 경쟁사 분석 03. 컬러시스템과 컨셉 04. 레이아웃 프로토타입

반응형 웹디자인 기획서 일민미술관redsunpark.com/design_plan/03_ilmin_design_plan.pdf · 02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

  • Upload
    others

  • View
    2

  • Download
    0

Embed Size (px)

Citation preview

Page 1: 반응형 웹디자인 기획서 일민미술관redsunpark.com/design_plan/03_ilmin_design_plan.pdf · 02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

반응형 웹디자인 기획서_일민미술관Responsive web design Planning document_Ilmin Museum of Art

기획자 : 박성준

기획일 : 2017. 09. 16

목차

01. 기획의도

02. 필요성 인식 및 경쟁사 분석

03. 컬러시스템과 컨셉

04. 레이아웃 프로토타입

Page 2: 반응형 웹디자인 기획서 일민미술관redsunpark.com/design_plan/03_ilmin_design_plan.pdf · 02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

01. 기획의도 Intention of the plan

ㄱ. 일민미술관 개요

일민문화재단에서 운영하는 미술관으로 전 동아일보 명예회장 김상만의 업적과 생애를 기리기 위하여 설립

되었다. 1926년에 지어진 동아일보사의 옛 사옥에 3개의 전시실을 갖추고 문을 열었다. 고려시대와 조선시대의

도자기와 서화, 근대기의 회화 등 일민컬렉션과 동아일보, 신동아, 여성동아에 실렸던 회화, 삽화 등 동아일보

소장품, 사회적 메시지가 담겨있는 현대미술작품을 소장하고 있다. 회화, 사진, 비디오, 설치 등의 매체를 통한

대중적이고 동시대적인 현대미술전시를 기획하고 있다.

ㄴ. 문화적 욕구충족의 필요성과 현대미술의 대중화

이른바 '먹고살기 급급했던'시대가 지나간 뒤, 한국사회는 누구나 영화관에서 보고싶었던 영화를보고, 유명한

뮤지컬팀이 내한공연을 한다면 한번쯤 보러 갈 수 있게 되었다. 이는 박물관 및 미술관등에도 다르지 않았는데,

과거에는 전공자나 중산층이상의 상징이었던 관람등의 행위가 20~30대 젊은층의 가벼운 데이트 코스 혹은

취미생활등으로 여겨지고 있다. 이 중 현대미술 및 디자인분야의 전시는 국립현대미술관, 서울시립미술관,

대립미술관 그룹, 일민문화재단등이 서울 전시관람 문화의 선두주자로 자리잡고 있으며, 일민미술관은 현대미술의

난해함을 대중에게 친근하게 접근할 수 있도록 시간마다 도슨트투어를 운영하는 등의 노력을 기울이고 있으며,

이는 대림미술관의 이용자들에게 큰 호응을 얻었고 대림미술관의 1층은 카페와 서점등의 대중적인 문화공간이

되었고, 대림미술관 이용객들의 증가라는 결과를 가져오게 되었다.

Page 3: 반응형 웹디자인 기획서 일민미술관redsunpark.com/design_plan/03_ilmin_design_plan.pdf · 02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

ㄱ. 사용자 경험을 고려하지 않은채 예술적인 부분에 초점을 맞춘 웹페이지

앞서말한 일민미술관의 이용객들을 위한 실제적인 노력과는 역설적으로 웹페이지는 지나치게 난해한 현대미술의

컨셉을 보이고 있다. 우선 사이트 전체를 뒤덮는 메인비쥬얼은 3가지 패턴의 전시물의 일부가 빠르게 변화하며

보여지는데, 이미지가 어두운 이미지로 변경될 때 상단의 로고와 타이틀이 부적절한 위치에서 어둡게 보이지

않음은 물론이고, 대부분의 사용자는 진행중인 전시 혹은 다가오는 전시에 대한 정보를 웹페이지의 메인에서

얻기를 기대하는데 이를 충족시키지 못하고 있다.

또한 GNB와 LNB의 위치또한 일반적인 사이트의 이용과는 많이 달라서 이용자에게 혼동을 주며, LNB의 상세분류

역시 지속적으로 일민미술관에 관심을 갖는 이용객이 아닌이상 알 수 없는 애매한 분류로 되어있었다. 하단에 있는

화살표버튼을 누르면 이용객들이 가장 궁금해할 관람 정보들이 위에서 아래로 올라오는데, 눈에 띄지않아 아쉬움이

크다.

마지막으로, 일민문화재단 역시 대림미술관 그룹처럼 일민미술관, 일민문화재단, 신문박물관이라는 3개의 세부

단체들로 구성되며 홈페이지 에서도 이들의 사이트로 연결되도록 구성되었는데, 일민문화재단은 일민미술관과

같은 형식의 틀을 가진 단일 페이지이고 신문박물관은 퀄리티가 많이 떨어지는 아예 다른 형식의 사이트 이다.

대림미술관그룹이 통일된 레이아웃과 퀄리티를 가진 세부사이트를 가진것에 비교된다.

<일민미술관 웹페이지 문제점 정리>

01. 사용자 경험을 고려하지 않은 지나치게 컨셉츄얼한 웹페이지

02. 웹페이지의 로고와 타이틀이 가시성이 떨어짐

03. 웹페이지의 구성요소가 일반적이지 않은 위치에 존재에 이용자에게 혼란을 줌

04. 같은 재단의 사이트들과 통일되지 않은 홈페이지의 형식

*좌측 상단부터 a,b,c

a. 일민미술관의 메인페이지

b. 어두운 배경이미지에 가려 제대로 보이지않는 로고와 타이틀

c. 일민미술관과 같은 계열의 사이트지만 전혀 다른 레이아웃인 '신문박물관' 웹페이지

Page 4: 반응형 웹디자인 기획서 일민미술관redsunpark.com/design_plan/03_ilmin_design_plan.pdf · 02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

ㄴ. 왜 반응형 웹페이지로 만들어야 하는가?

2017년 현재 미술관 관람등의 문화시설을 이용하는 주 고객은 20~30대의 젊은층이고 이들이 전시관련 정보를

얻는곳은 웹, 타블렛, 모바일 어디라고 정확하게 단정지을 수 없다. 이들은 밖에서 친구 혹은 연인과 시간을 보낼

장소를 모바일이나 태블릿으로 찾다가 자신의 디바이스에 적합한 사이트가 나오지 않으면 불편함을 느끼고 이내

다른 전시장으로 눈길을 돌릴 가능성이 높다.

ㄷ. 경쟁사 분석

현재 서울에서 대중적이고 규모있는 미술 및 디자인 전시장은 국립현대미술관(MMCA), 대림문화재단의

디뮤지엄, 대림미술관, 구슬모아 당구장, 그리고 우리가 새로 디자인을 내놓을 일민미술관이 있다. 이중 국립미술관

인 국립현대미술관(MMCA)은 다양한 계층의 이용객을 대상으로 하는 공공기관으로써의 보편적인 웹페이지

레이아웃을 크게 벗어나지 않은채, 감성적이고 컨셉츄얼한 부분을 잘 드러내고 있다.

다음으로, 대림문화재단의 대림미술관과 구슬모아당구장을 보면 보다 젊은층의 문화소통공간으로써의 역할을

하는 곳으로 좀 더 시원시원하고 직관적인 사이트의 구성을 볼 수 있다. 또한, 네임드 디자이너의 개인전을 위주로

하는 대림미술관과 젊은 국내신인아티스트들의 작업을 소개하는 구슬모아당구장은 같은 문화재단의 기관으로써

레이아웃은 통일성을 지키고 있지만, 로고와 메인비쥬얼이 나타내는 이미지가 확연히 다르다.

이에 일민미술관은 근현대미술품 및 한국 근현대디자인에 관한 전시를 주로 한다는 점과 대중들의 미술교육 및

문화소통공간으로써의 역할을 한다는점을 복합적으로 고려하여, 국립현대미술관(MMCA)과 대림문화재단의

웹사이트가 가진 장점을 융합한 '보편적이면서 직관적인' 웹페이지로 재탄생 하도록 제작 할 것이다.

*좌측 상단부터 a,b,c

a. 국립현대미술관(MMCA)의 메인페이지

b. 대림문화재단의 대림미술관 메인페이지

c. 대림문화재단의 구슬모아당구장 메인페이지

Page 5: 반응형 웹디자인 기획서 일민미술관redsunpark.com/design_plan/03_ilmin_design_plan.pdf · 02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

03. 컬러시스템과 컨셉 Color System and Concept

ㄴ. 컨셉

일민미술관 웹페이지 리뉴얼의 색채계획은 한국미술품의 은은하고 동양적인 색채와 일민미술관이 운영되는

동아일보 옛사옥의 근현대적인 색채를 복합적으로 가져온다. 또한 미술품과 전시포스터가 상대적으로 눈에 더

잘 띄어야하는 미술관 웹페이지의 특성을 고려하여 전반적인 색채계획을 저채도의 은은한 분위기로 구성하였다.

ㄱ. 컬러시스템

R : 233

G : 232

B : 227

R : 212

G : 212

B : 202

R : 74

G : 97

B : 104

R : 10

G : 15

B : 44

R : 186

G : 119

B : 110

Page 6: 반응형 웹디자인 기획서 일민미술관redsunpark.com/design_plan/03_ilmin_design_plan.pdf · 02. 필요성 인식 및 경쟁사 분석 Need Awareness and Competitive Analysis

web(1024 x 1700px) & wide (1025px ~)

Ilmin Museum of Art prototype

tablet(768 x 1600px) mobile(600 x 1600px)

1024 x 25px 768 x 25px 600 x 25px1024 x 50px 768 x 50px 600 x 50px

gnb영역 gnb영역 gnb영역

lnb영역 lnb영역 lnb영역

682 x 430px

768 x 430px 600 x 430px

1024 x 172px

768 x 172px

600 x 341px

메인비쥬얼

메인비쥬얼 메인비쥬얼

푸터

푸터

푸터

342 x 150px 342 x 200px

342 x 280px

342 x 280px휴관여부, 일정안내 휴관여부, 일정안내

일민 타이틀

일민 타이틀

341 x 341px 384 x 341px

600 x 341px

384 x 341px

600 x 341px

341 x 341px 384 x 341px

600 x 341px

384 x 341px

600 x 341px

341 x 341px 384 x 341px

600 x 341px

384 x 341px

768 x 172px

384 x 341px

600 x 341px

384 x 341px

341 x 341px

341 x 341px

341 x 341px

342 x 341px

342 x 341px

342 x 341px

전시안내 A 전시안내 A

전시안내 A

전시안내 B

전시안내 B

전시안내 C notice

notice

전시안내 C

전시안내 C

cafe ima 전시안내 D

전시안내 D

cafe ima

출판 / 아카이브

event

event

기둥서점

전시안내 B

전시안내 D

기둥서점

notice

event

출판 / 아카이브

1024 x 150px 1024 x 150px 600 x 150pxfulldown_menu fulldown_menu fulldown_menu

header detail

footer detail

로고

일민문화재단일민미술관 신문박물관 ENGSNSJOINLOGIN

VISIT

방문안내

미술관소개

카페/서점

오시는길

일민미술관

서울 종로구 세종대로 152세종로 139-8 일민미술관02-2020-2050

대표이사사업자등록번호통신판매업신고번호

문의전화이메일인증관련내용

sns icon

*현재 전시관련 이미지

*hover시 서치영역 슬라이드현재전시

지난전시

전시계획

전시연계

역자후기

작가소개

큐레이터렉쳐

워크숍

전시도록

일민시각문화

다큐멘터리

EXHIBITION PROGRAM ARCHIVE SEARCH

회사소개 이용약관 개인정보처리방침 청소년보호정책 제휴/프로모션문의 이메일주소무단수집거부 파트너센터 사업자정보확인