HANA THE NEXT · 하나더넥스트 웹진WEBZINE RENEWAL PROPOSAL

인생의 다음 장을펼치다

하나더넥스트 웹진 리뉴얼 제안
THE NEXT PAGE · MY NEXT ACT, 두 가지 방향

HANA THE NEXT · CASE STUDY하나더넥스트 웹진 리뉴얼 제안
스크롤을 내리면 세 줄이 움직입니다

E = 三로고의 E는 가로줄 세 개로 되어 있습니다
인생의 1막, 2막, 3막을 뜻합니다

X = ⟩X 안에는 「⟩」가 숨어 있습니다
인생의 다음 단계이자 화면의 「다음」 버튼입니다

THE NEXT PAGE · MY NEXT ACT「⟩」를 누르면 다음 장이 넘어갑니다
매주 펼치는 웹진과 나의 막을 찾는 웹진

케이스 읽기

01 / OVERVIEW프로젝트 개요

(New)시니어를 위한 브랜드의
콘텐츠 허브

하나더넥스트(HANA THE NEXT)는 하나금융그룹이 (New)시니어를 위해 만든 브랜드입니다. 브랜드 소개에는 「(New)시니어의 소중한 인생 2막을 위한 하나금융그룹만의 통합(금융&비금융) 솔루션」이라고 적혀 있습니다. 웹진 hana1qm.com은 이 브랜드의 콘텐츠 허브로, 하나금융연구소 하나더넥스트연구센터가 은퇴 준비와 자산관리, 시니어케어, 생활 속 법률, 은퇴 라이프에 관한 글을 매주 올립니다.

블루캔버스는 지금의 웹진을 만든 제작사이고, 이 웹진은 푸터에 GDWEB AWARD GOLD 배지를 달고 있습니다. 그사이 숏폼과 영상, 전문가 칼럼, 전국 여섯 곳의 라운지와 월간 세미나가 더해지면서 첫 화면에 실을 이야기가 크게 늘었습니다. 이번에는 지금 화면의 틀을 내려놓고, 처음부터 다시 그린다면 어떤 웹진이 될지 두 가지 시안으로 제안했습니다. 이 페이지는 그 과정을 정리한 기록입니다.

CLIENT: 하나은행 · 하나더넥스트
콘텐츠 제작 하나더넥스트연구센터
WEBSITE: hana1qm.com
(New)시니어 웹진
OUR ROLE: 지금 웹진 구축, 리뉴얼 리서치,
브랜드 해석, 정보 구조, UI, 모션
DELIVERABLE: 메인 시안 2종, 모바일 화면,
읽기 기준, 컬러 · 서체 가이드

16년카카오톡을 써 온 시간카카오톡이 나온 2010년에 이 독자들은 36~51세였습니다
11개주제 키워드#은퇴코칭부터 #디지털길잡이까지, 지금 웹진의 주제 태그
6곳하나더넥스트 라운지을지로 · 선릉역 · 서초동 · 영등포 · 대구중앙 · 대전
3가지구독 채널카카오톡 채널 · 하나원큐 앱 알림 · 메일링 서비스

02 / CHALLENGE출발점

hana1qm.com · 메인

01이 주의 콘텐츠큰 사진 한 장과 제목
02추천 콘텐츠글 다섯 편 목록
03주제별 키워드태그 열한 개
04구독 서비스카카오톡 · 하나원큐 앱 버튼
05배너은퇴 준비 신호등
06숏폼세로 영상 세 편
07영상가로 영상 두 편
08전문가칼럼 카드 네 장
09라운지라운지 사진 여섯 곳
10배너 둘은퇴 MBTI · 리빙트러스트
11더 많은 콘텐츠글 여덟 편

11개의 블록1440px 화면에서 메인 페이지의 길이는 화면 여섯 장(5,402px)입니다. 블록마다 무게가 비슷해, 이번 주에 꼭 읽을 글과 오래 두고 볼 글이 구분되지 않았습니다.

Q1
독자는 몇 살이고, 어떤 눈으로 읽을까요?
브랜드가 정한 독자는 만 50~64세입니다. 카카오톡을 16년째 쓰는 세대이지만, 대부분 노안이 시작된 눈으로 화면을 읽습니다. 지금 웹진의 본문은 20px로 큰 편인데, 날짜와 버튼 글자는 연한 회색이고 전문가 이름표는 11px까지 작아집니다.
Q2
날짜가 지나도 유효한 글을 어떻게 다시 꺼낼까요?
연금을 받기 시작하는 시기나 유언대용신탁을 다룬 글은 몇 달이 지나도 그대로 쓸모가 있습니다. 그런데 지금은 새 글이 올라올수록 아래로 밀려납니다. 날짜 대신 인생의 막과 주제로 다시 찾을 수 있어야 했습니다.
Q3
읽은 다음에는 어디로 이어져야 할까요?
웹진에는 구독 채널 세 가지와 라운지 여섯 곳, 월간 세미나가 있지만 첫 화면 곳곳에 흩어져 있습니다. 읽기에서 구독과 세미나, 상담으로 이어지는 길을 한 줄로 정리해야 했습니다.
Q4
금융그룹의 웹진이 어떻게 활기차 보일까요?
브랜드는 NEXT를 New · Energetic · Xtraordinary · Timeless로 풀었습니다. 금융그룹다운 신뢰를 지키면서도 「나이 든 사람을 위한 사이트」처럼 보이지 않는 표정이 필요했습니다.

03 / NAME이름 다시 읽기

로고 모티브 설명 출처: 하나더넥스트 웹진 「브랜드 소개」

01 · HANA THE NEXT
(New)시니어를 위한 새 브랜드
하나더넥스트는 하나금융그룹의 새 성장동력이 될 브랜드로, (New)시니어의 인생 2막을 위한 금융과 비금융 솔루션을 한데 묶었습니다. 웹진은 이 브랜드가 독자를 매주 만나는 자리입니다.
02 · N = NEW
새로운 시니어
(New)시니어는 기존 시니어층과 뉴시니어를 아우르는 말입니다. 뉴시니어는 2차 베이비부머(1964~1974년생)와 일부 1차 베이비부머(1959~1963년생)를 포함한 만 50~64세를 가리킵니다.
03 · E = 三
세 줄은 세 개의 막
로고는 E의 세로획을 지우고 가로줄 세 개만 남겼습니다. 인생 1막을 지나 2막을 준비하는 사람들의 3막까지, 인생의 모든 순간을 함께 고민하겠다는 뜻입니다.
04 · X = ⟩
X 안에 숨은 「⟩」
X의 왼쪽 절반은 오른쪽 획과 떨어진 「⟩」입니다. 브랜드는 이 기호를 인생의 다음 단계이자 미래를 향한 확장 가능성이라고 설명합니다.
05 · T = TIMELESS
살아온 시간과 살아갈 시간
NEXT의 네 글자는 New · Energetic · Xtraordinary · Timeless의 첫 글자이기도 합니다. 브랜드는 이 말을 「살아온 특별한 시간에 대한 존중과 앞으로 살아갈 활력 넘치는 삶에 대한 응원」이라고 풀었습니다.
06 · OUR READING
로고 안에 이미 「다음」 버튼이 있습니다
화면에서 「⟩」는 다음 장으로 넘어가는 버튼이고, 가로줄 세 개는 목록과 문단을 나누는 가장 기본적인 선입니다. 두 시안은 새 장식을 만들기보다 로고가 이미 가진 이 두 가지를 화면의 규칙으로 옮기는 데서 출발했습니다.

04 / READER독자의 시간표

디지털이 낯선 세대가 아니라
눈이 달라진 세대

브랜드가 정한 독자는 1959년생부터 1974년생까지입니다. 이들은 서울올림픽과 외환위기를 10~30대에 지났고, 스마트폰과 카카오톡이 나온 2009~2010년에는 35~51세였습니다. 그래서 두 시안은 독자를 「디지털이 서툰 어르신」으로 그리지 않았습니다.

달라진 것은 눈입니다. 노안은 보통 40대 무렵에 시작되어, 지금 이 독자들은 대부분 가까운 글자를 읽기가 전보다 어렵습니다. 두 시안은 말투와 화면 구성을 젊게 두되, 글자 크기와 대비, 누르는 곳의 크기는 처음부터 넉넉하게 잡았습니다.

출생연도를 골라 보세요 1966년생

2026년, 만 60세가 되는 해

1988서울올림픽22세
1997외환위기31세
2009아이폰 국내 출시43세
2010카카오톡 출시44세
2026올해60세
2030국민연금 노령연금을 받기 시작하는 해64세

나이는 그해에 맞는 만 나이입니다. 국민연금 노령연금 수급 개시 연령은 출생연도에 따라 1957~1960년생 62세, 1961~1964년생 63세, 1965~1968년생 64세, 1969년생 이후 65세입니다.

05 / READING읽기 기준

젊은 활기,
큰 글씨

지금 웹진은 넓은 화면에서 기사 본문을 20px로 보여 줍니다. 처음 만들 때부터 글자를 크게 잡은 덕분입니다. 그런데 날짜는 연한 회색이고, 전문가 이름표와 「지금 확인하기」 같은 보조 글자는 회색에 11~15px까지 작아집니다.

리뉴얼에서는 가장 작은 글자의 기준부터 올렸습니다. 아래 두 카드는 같은 글을 지금 웹진과 새 기준으로 다시 짠 것입니다. 「50대의 눈으로 보기」를 켜면 회색 글자가 먼저 사라지는 것을 확인할 수 있습니다.

새 기준 글자 크기

지금 웹진 1440px 화면에서 잰 크기와 색

은퇴·노후연금술사

연금 받으면서 일하면 연금이 줄어들까요?

2026.10.16

국민연금을 받으면서 일하는 것은 가능합니다. 다만 소득이 일정 기준을 넘으면 연금 일부가 줄어들 수 있으니, 일을 시작하기 전에 기준을 먼저 확인해 두세요.

은퇴전문가

지금 확인하기

새 기준 본문 20px · 가장 작은 글자 14px 이상

은퇴·노후#연금술사

연금 받으면서 일하면 연금이 줄어들까요?

2026년 10월 16일 · 4분 읽기

은퇴설계 전문가 칼럼

글 읽기

「50대의 눈으로 보기」는 가까운 글자가 흐려 보이는 정도를 흐림 필터로 단순하게 옮긴 것입니다.

항목지금 웹진새 기준메모

기사 본문 20px · 400 · #454343대비 9.8:1 20px · 400 · #0F2A24대비 15.2:1 줄 간격 1.6 → 1.8

목록의 날짜 20px · 400 · #949494대비 3.0:1 16px · 500 · #4A5B56대비 7.1:1 크기보다 대비를 올렸습니다

전문가 이름표 11px · 400 · #949494대비 3.0:1 15px · 700 · #00594A대비 8.3:1 가장 작던 글자

버튼 「지금 확인하기」 15px · 500 · #9CA7B3대비 2.4:1 17px · 700 · #FFFFFF / #00594A대비 8.3:1 글자 대신 면에 색을

저작권 표기 15px · 300 · #9CA7B3대비 2.4:1 14px · 500 · #4A5B56대비 7.1:1 얇은 300 굵기는 쓰지 않습니다

18px본문은 18px 이상
휴대폰에서도 17px 아래로 내리지 않습니다.
1.7배줄 간격 1.7배 이상
줄이 바뀔 때 다음 줄의 첫 글자를 놓치지 않게 합니다.
14px가장 작은 글자 14px
날짜와 이름표, 저작권 표기까지 같은 기준을 지킵니다.
7:1본문 대비 7:1
나머지 글자도 모두 4.5:1 이상으로 맞춥니다.
48px누르는 곳 48px
버튼과 메뉴, 주제 칩을 손가락 하나로 정확히 누를 수 있게 합니다.
3단계글자 크기 3단계
헤더의 「가 가 가」로 본문을 바로 키우고, 고른 값은 다음 방문에도 남깁니다.

06 / STRUCTURE정보 구조

날짜순에서
인생의 순서로

지금 웹진의 메뉴는 은퇴·노후, 자산관리, 시니어케어, 법률이야기, 라이프, 하나더넥스트, 숏폼·영상의 일곱 가지이고, 그 아래에 주제 키워드 열한 개가 있습니다. 두 시안은 이 분류를 지우지 않고 다섯 가지 주제로 묶은 뒤, 독자가 지금 어느 막에 있는지를 두 번째 축으로 더했습니다.

같은 상속 이야기라도 2막을 준비하는 50대에게는 세금이, 3막을 함께 설계하는 가족에게는 신탁이 먼저 필요합니다. 아래 표에서 막이나 주제를 고르면 그 줄에 놓일 글을 볼 수 있습니다.

1막2막을 준비하는

퇴직금, IRP로 받을까 일시금으로 받을까

쉰 이후의 근력, 하루 20분이면 지킬 수 있습니다

집 한 채로 준비하는 노후, 주택연금 알아보기

자녀에게 집을 물려주기 전에 알아 둘 세금

쉰에 시작한 기타, 석 달 만에 한 곡

2막2막을 사는

연금 받으면서 일하면 연금이 줄어들까요?

먹는 약이 늘어날수록 조심할 것들

은퇴 뒤 작은 집으로 옮길 때 따져 볼 것

리빙트러스트는 누구에게 필요할까

기차로 떠나는 가을 소도시 세 곳

3막3막을 함께 설계하는

부모님 노후 자금, 자녀와 함께 점검하는 법

부모님 장기요양등급, 신청부터 판정까지

요양 시설과 재가 돌봄은 무엇이 다를까

유언장 대신 신탁? 유언대용신탁 쉽게 이해하기

스마트폰으로 병원 예약부터 길 찾기까지

읽은 다음의 길지금 웹진에서는 구독 버튼과 라운지 소개, 배너가 첫 화면 곳곳에 흩어져 있었습니다. 두 시안은 이 길을 한 방향으로 이었습니다.

READ읽기「이 주의 콘텐츠」와 주제별 글
매주 새 글이 올라옵니다.
SUBSCRIBE구독카카오톡 채널 · 하나원큐 앱 알림 · 메일
다음 주 글을 먼저 받아 봅니다.
SEMINAR세미나라운지 월간 세미나
글에서 다룬 주제를 직접 듣습니다.
LOUNGE상담하나더넥스트 라운지 여섯 곳
내 상황에 맞게 묻고 답을 듣습니다.

07 / COLOR컬러

하나 그린은 그대로,
활력은 새로

지금 웹진의 스타일시트에서 가장 많이 쓰인 유채색은 초록 #009178입니다. 로고와 버튼, 카테고리 이름이 모두 이 색입니다. 두 시안은 이 초록을 그대로 두고, 바탕과 짝이 되는 색으로 성격을 나눴습니다.

A안은 흰 종이와 짙은 초록 글자에 햇살 같은 노랑을 아주 조금 더했고, B안은 깊은 숲빛 무대에 민트 글자와 호박색 조명을 더했습니다. 흰 바탕 위의 #009178은 대비가 3.9:1이라 큰 제목과 버튼 면에만 쓰고, 작은 초록 글자는 더 짙은 초록으로 바꿨습니다.

THE NEXT GREEN#009178지금 웹진 스타일시트 20회 · 로고 이미지 #009476

가큰 제목 · 버튼 면#009178 / #FFFFFF · 3.9:1

가작은 초록 글자#00594A / #FFFFFF · 8.3:1

가초록 버튼의 흰 글자#FFFFFF / #009178 · 3.9:1

가어두운 무대의 민트 글자#A8E6D2 / #073B32 · 8.8:1

바탕표지와 기사, 차례가 놓이는 흰 종이입니다. 크림색이 아니라 브랜드의 흰색을 그대로 썼습니다.
강조 면 · 버튼전문가 질문과 구독 구역의 바탕, 버튼 면입니다. 흰 글자와 대비가 8.3:1입니다.
정보 면차례와 라운지 정보를 담는 연한 민트입니다.
보조 글자설명 문장과 날짜에 쓰는 회녹색입니다. 흰 바탕과 대비가 7.1:1입니다.
제목 · 본문검정 대신 쓴 아주 짙은 초록입니다. 흰 바탕과 대비가 15:1을 넘습니다.
구분선차례와 목록을 나누는 선입니다.
로고 · 표지 버튼로고와 표지의 「⟩」 버튼에만 쓰는 브랜드 초록입니다.
활력 포인트제목 옆 별표와 영상 진행선에만 아주 조금 쓰는 노랑입니다.

비율은 두 시안의 PC 화면 전체를 장면별로 찍어, 각 색에 가까운 화소를 센 값입니다. 색 견본을 누르면 HEX 값이 복사됩니다.

08 / TYPOGRAPHY서체

또렷한 고딕 하나로
크게, 굵게, 넉넉하게

두 시안의 한글은 모두 Pretendard 하나로 짰습니다. 획이 고르고 숫자 폭이 일정해 날짜와 금액이 많은 웹진에서도 줄이 흔들리지 않습니다. A안은 영문 라벨까지 Pretendard로 맞췄고, B안은 「MY NEXT ACT」와 ACT 번호, 출생연도 같은 큰 숫자에 너비를 조절할 수 있는 Archivo를 짝지었습니다.

크기는 본문에서 시작해 위아래로 정했습니다. 본문 20px를 기준으로 기사 제목과 구역 제목을 키우고, 가장 작은 글자는 14px에서 멈춥니다.

글자 크기

표지 제목56px · 800인생의 다음 장

구역 제목40px · 800이번 주에 읽을 글

기사 제목28px · 700퇴직 1년 전, 꼭 확인할 다섯 가지

본문20px · 400연금을 받기 시작하는 나이는 출생연도에 따라 다릅니다.

보조 글자16px · 5002026년 10월 16일 · 4분 읽기

Pretendard Variable · A안 · B안

다음 장, 다음 막

한글 제목과 본문, 날짜와 숫자를 모두 맡았습니다. 본문은 보통 굵기로, 제목은 아주 굵게 썼습니다.

Archivo · B안

MY NEXT ACT 1966

너비를 62에서 125까지 바꿀 수 있는 산세리프입니다. 넓게 펼친 ACT 번호와 출생연도가 무대 위에서 또렷하게 보입니다.

로고 · HANA THE NEXT

두 시안 모두 로고를 새로 그리지 않고 원래 도형 그대로 썼습니다. 어두운 면에서는 흰색으로만 바꿨습니다.

09 / MOTION움직임

움직임은
「⟩」 방향으로만

웹진의 움직임은 두 가지 일만 합니다. 다음 장으로 넘어간다는 것을 알려 주고, 새 구역이 시작된다는 것을 알려 줍니다. 글을 읽는 동안에는 화면이 움직이지 않습니다.

01
⟩ 방향으로 넘긴다

A안의 표지는 왼쪽 모서리를 축으로 오른쪽에서 왼쪽으로 넘어가고, B안은 막이 바뀔 때마다 아래 진행 표시의 「⟩」가 한 칸씩 나아갑니다. 로고의 「⟩」가 가리키는 방향이 곧 「다음」입니다.
02
세 줄로 연다

로고의 세 줄은 구역을 여는 표시가 됩니다. A안은 세 개의 장을 가로줄 세 개로 펼치고, B안은 구역 이름 앞에 세 줄 기호를 붙였습니다. 독자는 그 표시만 보고도 이야기가 바뀌었다는 것을 압니다.
03
읽을 때는 멈춘다

본문이 화면에 들어오면 배경과 사진은 움직이지 않습니다. 기기에서 「동작 줄이기」를 켜면 넘김과 확대도 모두 꺼집니다.

제안 A안 · 다음 장

THE NEXT PAGE인생의 다음 장, 함께 펼쳐요

웹진을 매주 한 장씩 넘기는 잡지로 다시 그린 방향입니다. 첫 화면에는 「인생의 다음 장, 함께 펼쳐요」라는 제목 아래 돈 · 건강 · 삶 세 장의 표지가 놓이고, 스크롤을 내리거나 「⟩」를 누르면 표지가 왼쪽 모서리를 축으로 책장처럼 넘어갑니다. 그 아래로 로고의 세 줄을 늘인 세 개의 장, 잡지 차례처럼 짠 주제, 큰 글씨로 읽는 이 주의 읽을거리, 전문가 질문, 숏폼, 라운지, 구독이 이어집니다.

돈 · 건강 · 삶 세 장의 표지를 스크롤과 「⟩」로 넘기는 첫 화면
50대 · 60대 · 가족, 세 개의 장으로 다시 묶은 기사
본문을 20px에서 26px까지 키우는 읽기 화면과 듣기 버튼
라운지 여섯 곳을 고르면 11월 세미나가 바뀌는 라운지 구역

Pretendard

DIRECTION NOTES

시안 A의 장면 가운데 연출에 공을 들인 순간을 골랐습니다. 사진을 누르면 장면별 화면을 크게 볼 수 있습니다.

인생의 다음 장, 함께 펼쳐요
첫 화면입니다. 큰 제목 아래 돈 · 건강 · 삶의 표지가 놓이고, 오른쪽 「⟩」를 누르면 다음 표지로 넘어갑니다.
건강의 다음 장
스크롤을 내리면 표지가 왼쪽 모서리를 축으로 넘어가 두 번째 표지 「가벼운 발걸음이 하루를 바꿉니다」가 열립니다.
삶의 다음 장
세 번째 표지는 기차 창가의 부부입니다. 표지 아래 진행 표시가 세 장 가운데 어디쯤인지 알려 줍니다.
세 개의 장
로고 E의 세 줄을 화면 폭으로 늘이고, 2막을 준비하는 50대 · 2막을 사는 60대 · 3막을 함께 설계하는 가족의 줄마다 기사를 놓았습니다.
잡지의 차례처럼
01부터 06까지 번호를 단 주제 차례입니다. 주제에 마우스를 올리면 왼쪽 사진과 대표 기사가 바뀝니다.
천천히 읽는 시간
이 주의 읽을거리는 본문 20px에서 시작해 23px · 26px로 키울 수 있고, 「듣기」 버튼으로 기사를 소리 내어 읽어 줍니다.
전문가에게 묻다
질문을 먼저 크게 적고, 누르면 답이 펼쳐집니다. 전문가는 이름과 얼굴 대신 역할과 기호로 표시했습니다.
화면 밖에서도
라운지 여섯 곳 가운데 하나를 고르면 그 라운지의 11월 세미나가 보입니다.

MY NEXT ACT독자의 막에 맞춰
다시 고르는 웹진으로

THE NEXT PAGE매주 한 장씩
넘기는 웹진에서

제안 B안 · 다음 막

MY NEXT ACT인생 2막, 그다음 막까지

로고 E의 세 줄을 인생의 세 막으로, X 안의 「⟩」를 한 걸음 앞으로 읽은 방향입니다. 첫 화면에서는 세 줄의 빛이 하나씩 켜지고, 스크롤을 내리면 커튼처럼 갈라지며 사진과 제목이 열립니다. 이어서 웹진이 「지금 어느 막에 계신가요?」라고 묻고, 출생연도를 고르면 연금을 받기 시작하는 나이와 지금의 막, 맞춤 글 세 편이 바뀝니다. 그 뒤로 세 개의 막, 이번 주 콘텐츠, 묻고 답하기, 영상, 라운지와 세미나, 하나더넥스트 이야기가 이어집니다.

세 줄의 빛이 무대 조명처럼 켜지고 커튼처럼 갈라지는 첫 화면
출생연도를 고르면 연금 받는 나이와 지금의 막, 맞춤 글이 바뀌는 「나의 막 찾기」
ACT 1 · 2 · 3을 「⟩」 진행 표시와 함께 넘기는 세 개의 막
라운지를 고르면 그 라운지의 11월 세미나가 열리는 도식 지도

Pretendard · Archivo

DIRECTION NOTES

시안 B의 장면 가운데 연출에 공을 들인 순간을 골랐습니다. 사진을 누르면 장면별 화면을 크게 볼 수 있습니다.

세 줄의 무대
불이 꺼진 무대에서 로고 E의 세 줄이 하나씩 켜지고, 오른쪽에 호박색 「⟩」가 들어옵니다.
막이 열리면
스크롤을 내리면 세 줄이 넓어지며 커튼처럼 갈라지고, 그 사이로 문턱을 넘어 햇빛 쪽으로 걸어가는 사진이 열립니다.
인생 2막, 그다음 막까지
사진이 다 열리면 제목과 「나의 막 찾기」 버튼이 떠오릅니다.
지금 어느 막에 계신가요?
출생연도를 고르면 올해 나이, 국민연금을 받기 시작하는 나이와 그해, 지금의 막과 읽기 좋은 글 세 편이 바뀝니다.
ACT 1 · 일을 정리하는 시간
화면이 고정된 채 막이 바뀝니다. 윤곽선만 남긴 큰 숫자와 사진, 글 세 편이 차례로 들어옵니다.
ACT 3 · 오래 함께하는 시간
마지막 막은 상속 · 증여 · 신탁과 요양을 다룹니다. 아래 진행 표시의 「⟩」가 세 번째 칸에 닿습니다.
가까운 라운지에서
서울 네 곳을 한 묶음으로 그린 도식 지도에서 라운지를 고르면, 오른쪽에 그 라운지의 11월 세미나가 나옵니다.
NEXT, 네 글자에 담은 응원
브랜드가 풀어 쓴 New · Energetic · Xtraordinary · Timeless와 로고 모티브 세 가지를 웹진 안에서 소개합니다.

10 / PROCESS과정

네 갈래에서
두 방향으로

첫 화면을 무엇으로 시작할지 정하기 위해 네 방향을 와이어프레임으로 먼저 비교했습니다. 두 방향은 시안이 되었고, 나머지 두 방향은 버리지 않고 시안 안의 한 구역으로 옮겼습니다.

01
매주 넘기는 잡지

「이 주의 콘텐츠」를 잡지 표지처럼 크게 세우고, 표지를 넘기며 지난주와 다음 주를 오가는 방향입니다.
A안 THE NEXT PAGE로 발전
02
나의 막 찾기

독자가 출생연도나 지금의 상황을 고르면, 그 막에 맞는 글부터 보여 주는 방향입니다.
B안 MY NEXT ACT로 발전
03
라운지 지도

라운지 여섯 곳과 세미나 일정을 첫 화면에 크게 두는 방향입니다. 라운지 네 곳이 서울에 모여 있어, 다른 지역 독자에게는 첫 화면이 멀게 느껴질 수 있었습니다.
라운지 구역으로 옮김
04
숏폼 피드

숏폼과 영상을 세로 피드로 앞세우는 방향입니다. 글로 차근차근 읽어야 이해되는 연금과 상속 이야기가 짧은 영상 사이에 묻힐 수 있었습니다.
영상 구역으로 옮김

01지금 웹진 다시 읽기
메뉴 일곱 개와 키워드 열한 개, 메인 블록 열한 개를 정리하고 글자 크기와 색을 화면에서 직접 쟀습니다.
02브랜드 해석
브랜드 소개에 적힌 NEXT 네 글자와 로고의 디자인 모티브 세 가지를 화면의 규칙으로 옮길 수 있는지 살폈습니다.
03독자와 읽기 기준
(New)시니어의 출생연도와 연금 수급 연령을 정리하고, 가장 작은 글자부터 기준을 다시 세웠습니다.
04구조
인생의 막 세 개와 주제 다섯 개로 글을 다시 묶고, 읽기에서 상담까지 이어지는 길을 그렸습니다.
05네 갈래 스케치
잡지 · 나의 막 · 라운지 지도 · 숏폼 피드 네 방향을 와이어프레임으로 비교했습니다.
06두 가지 시안
두 방향을 실제로 스크롤할 수 있는 메인 페이지로 만들고, 사진은 50~60대의 활기 있는 일상으로 새로 준비했습니다.
07모바일과 정리
390px 화면에서 장면을 다시 짜고, 컬러 · 서체 · 움직임 기준을 한 문서로 묶었습니다.

노쇠가 아니라
활기를 찍었습니다

지금 웹진은 글마다 다른 사진과 그림을 섬네일로 씁니다. 두 시안은 큰 화면에 걸 사진으로 50~60대가 주인공인 일상을 새로 준비했습니다. 지팡이나 병상 같은 상투적인 장면은 빼고, 가계를 정리하고, 새벽에 걷고, 물레를 배우고, 가족과 저녁을 먹는 장면을 골랐습니다. 사진에는 글자와 상표를 넣지 않았습니다.

11 / MOBILE모바일

손안에서 읽는
한 주의 웹진

웹진의 구독 채널 세 가지 가운데 두 가지가 카카오톡 채널과 하나원큐 앱 알림입니다. 그래서 독자가 웹진을 휴대폰에서 여는 경우가 많다고 보고, 두 시안 모두 390px 화면에서 장면을 다시 짰습니다. 글자 크기 단추는 A안이 모바일 헤더에 그대로 두었고, B안은 전체 화면 메뉴 안에 「기본 · 크게 · 더 크게」로 넣었습니다.

COMPARE두 방향은 어떻게 다를까요

같은 웹진을 여는
다음 장과 다음 막

두 시안은 같은 독자와 같은 글을 다루지만, 첫 화면에서 먼저 건네는 말이 다릅니다. A안은 이번 주의 표지로 시작해 주제와 막으로 넓어지고, B안은 독자에게 지금 어느 막에 있는지 먼저 묻고 그 답에 맞춰 글을 고릅니다. 하나더넥스트가 웹진에서 가장 먼저 건네고 싶은 말에 따라 고를 수 있도록 차이를 정리했습니다.

구분A · THE NEXT PAGEB · MY NEXT ACT

첫 화면돈 · 건강 · 삶 세 장의 사진 표지를 넘기는 잡지 표지세 줄의 빛이 커튼처럼 갈라지며 사진이 열리는 무대

첫 문장인생의 다음 장, 함께 펼쳐요인생 2막, 그다음 막까지

로고에서 가져온 것「⟩」를 표지를 넘기는 버튼으로세 줄을 인생의 세 막으로, 「⟩」를 진행 표시로

색흰 종이와 짙은 초록, 햇살 노랑 한 방울숲빛 무대와 민트 글자, 호박색 조명

서체Pretendard 하나Pretendard · Archivo

글을 고르는 방식50대 · 60대 · 가족, 정해 둔 세 개의 장출생연도로 고르는 나의 막과 맞춤 글 세 편

읽기본문 20 · 23 · 26px 세 단계와 듣기 버튼본문 100 · 112.5 · 125% 세 단계

라운지라운지 버튼과 11월 세미나 목록도식 지도에서 고르는 라운지와 세미나

무게를 둔 곳이번 주에 함께 읽을 글지금 나에게 맞는 글

12 / CREDITSCONTENTS · BLUECANVAS WORKS 2026

HANA THE NEXT WEBZINE · RENEWAL