brunch

You can make anything
by writing

C.S.Lewis

by Melon Design Sep 21. 2018

어머 이건 꼭 들어야 해!
한국 대중음악 명반100

국내 대중음악 전문가가 선정한 한국 대중음악 명반100을 소개하는 서비스

한국을 대표하는 명반을 듣고 싶어
전문가가 선정한 음반은 어떤 곡일까?
명반100에는 어떤 최신 앨범이 있을까?



얼마 전인 8월 28일부터 공개되고 있는 멜론의 한국 대중음악 명반100을 들어 보셨나요?

한국 대중음악 명반100은 한겨레X멜론X태림스코어가 공동 기획하여 음악 평론가, 음악방송PD, 음악전문 기자 등 음악 관련 전문가 47명이 엄선한 100개의 앨범을 공개하는 서비스입니다. 

한국 대중음악은 30년 전부터 10년 단위로 정리가 되었었기 때문에 이번에 명반100으로 멜론에서 공신력 있는 대한민국 명반을 정리해보자는 계기로 진행이 되었습니다. 한국 대중음악 명반100에서는 시대를 초월하고 장르 불문한 다양한 앨범을 들어볼 수 있는데요, 듣다보면 명반임을 느낄 수 있는 새로운 음악도 접할 수 있어서 색다로운 즐거움도 느낄 수 있습니다.


멜론에서는 1위부터 100위까지 국내 음반들을 차례로 순위를 매겨서 매주 화요일, 금요일 두번씩 공개를 하고 있습니다. 현재 8월 28일부터 5주간 100위부터 역순으로 10장의 앨범씩 공개가 되고 있는 중입니다. 멜론에서 순위가 공개 될 때마다 방문자수가 일반 서비스페이지에 비해 꽤 높으며, 댓글도 많이 달아주시는 등 반응이 열렬하다고 하네요.


 그럼 명반100 서비스의 모바일과 PC WEB의 구성을 설명해 드리겠습니다.


한국 대중음악 명반100 모바일 주요화면




명반100 구성

최신공개순위 · 이벤트 · 명반100소개 · 선정단소개 · 선정기준 · 전체순위리스트 · 상세페이지


최신 공개된 명반은 임팩트 있게, 한 눈에 알아볼 수 있는 스와이프 구조

명반100은 매주 10곡씩 새로운 순위가 공개되다보니 페이지의 최상단에는 최근에 공개된 명반10개가 바로 보여질 수 있는 구조에 포커싱을 두었습니다. 스와이프 구조로 10개의 명반을 바로 확인하고 더보기 버튼을 누르거나 전체순위 버튼을 눌러서 서브페이지로 이동 후 전체 순위를 볼 수 있도록 하였는데요, 이런 구조라면 스크롤을 하지 않고도 빠르게 최근순위 확인 및 전체순위를 확인 할 수 있겠죠?


그리고, 명반에는 예전 대중음악 앨범들이 많은데요. 아무래도 몇 십년 전에 만들어진 앨범자켓들이 많다보니 이미지 퀄리티가 좋지 않은 경우들이 꽤 있었습니다. 메인화면에 부담되지 않는 사이즈로 앨범자켓을 배치하고 스와이프로 넘겨보면서도 지루해하지 않을 요소를 생각하다보니 카드뷰에 앨범자켓과 어우러지는 컬러를 넣어보는건 어떨까하여 총 6개의 컬러로 배경컬러를 적용하였습니다. 시원하게 보여지는 컬러감으로 앨범에 대한 이미지도 한층 더 부드러워진 것 같습니다.


명반100 모바일 메인화면


전체 순위를 모아 볼 수 있고 전문가의 선정평도 볼 수 있어요.

순위 페이지에서 공개된 모든 순위를 확인 할 수 있으며 상단의 소팅에서는 10단위의 순위별로 골라서 리스트를 볼 수 있습니다. 리스트에서는 각 앨범의 정보와 선정평의 타이틀을 노출하여 편의를 제공하여, 사용자의 관심을 끌 수 있습니다. 또한 상세페이지는 앨범에 대한 모든 정보와 궁금한 음악 전문가의 상세한 선정평까지 확인이 가능하니, 시간이 될 때 모든 명반을 듣고 선정평을 한 페이지씩 넘겨 본다면, 한국 대중음악의 역사를 느낄 수 있는 좋은 시간이 될 수 있을거라 생각됩니다. 


명반100 전체순위 보기
음악 전문가의 선정평


명반100 모바일 : https://m.app.melon.com/masterpiece/timeline.htm?&ref=&snsGate=Y




명반100 PC

명반 메인, 명반 소개, 앨범 상세


넓은 화면으로 다양한 정보를 한눈에!

명반 100 PC 버전은 웹의 넓은 화면 사이즈의 장점을 살려 더욱 폭넓고 다양한 정보를 한눈에 보여 줄 수 있도록 초점을 맞추어 진행하였습니다.

룩앤필은 동일하게 맞추되 모바일은 금주 공개되는 곡들을 상단에 DP하였다면 PC는 각각의 순위를 클릭하면 하단 리스트에서 바로바로 볼수 있는 구조로 작업 되었습니다. 또한 전체 순위를 넣어 사용자가 어떤 앨범이 순위에 있는지 한번에 파악하고 원하는 곡을 감상할 수 있게 최적화 한 점이 PC 명반 100의 특징입니다. 


명반 100 PC ver. 메인 화면



정보와 감성을 담은 명반 100 소개 페이지

명반 소개는 상단 명반 앨범을 DP하여 키 비주얼을 잡고 하단은 명반에 관련된 정보를 보여주는 형식으로 작업하였습니다. 상단 비주얼은 명반의 대표 컬러인 파스텔톤의 은은한 배경컬러와 각 세대를 대표하는 명반을 넣어주어 감성적인 느낌을 살렸고 하단은 명반의 서비스 소개와 선정단을 어떤 기준으로 뽑는지에 대한 정보를 잘 읽히게 작업을 하였습니다. 또한 사용자들이 47명의 선정단 정보를 한번에 다 보기에 불편함을 덜고자 접기와 펼침의 버튼을 넣어 선택하여 볼수 있도록 작업 하였습니다.


명반 소개 페이지 뷰



주목도를 잡아주는 명반 100 앨범 

명반 pc버젼에서 가장 중요한 앨범 상세 부분은 기존의 앨범 상세와는 차별화 된 디자인으로 진행 하였습니다. 100개의 명반으로 선정 된 특별한 앨범이라는 것을 보여주기 위하여 중앙으로 비주얼을 넣어 시각적으로 집중될 수 있도록 하였고 블러 bg를 사용하여 앨범이 강조 될 수 있도록 작업 하였습니다.

이 앨범이 명반으로 선정 된 이유를 명확하게 보여주고자 앨범정보 바로 아래에 소개 부분을 넣어 사용자들이 천천히 리뷰를 읽어가며 음악을 감상할 수 있도록 UI 위치에 변화를 주었습니다.


앨범 소개 페이지 뷰


명반 100 PC : https://www.melon.com/masterpiece/timeline.htm?&ref=

 



엄선된 최고의 음악은 멜론과 함께!

지금까지 멜론 한국 대중음악 명반100에 대해 살펴 보았습니다. 다양하고 신선한 컨텐츠로 여러분들의 일상속에서 음악으로 힐링을 제공하려는 멜론의 노력. 앞으로 또 어떤 새로운 컨텐츠가 나올지 너무 궁금합니다. 오늘은 퇴근하면서 혹은 포근한 이불에서 잠들기 전 잊었던 명반을 감상해 보시는 건 어떨까요?




* 매주 공개되는 명반100은 유튜브 채널 <한겨례TV>에서 동영상으로도 만나실 수 있습니다. 멜론 매거진에서도 확인할 수 있으니 자주 찾아주세요. 

한겨례TV 유튜브채널



작가의 이전글 나만의 뮤직 페이스메이커 2탄
작품 선택
키워드 선택 0 / 3 0
댓글여부
afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari