본문 바로가기
플랜디 블로그 상단 배경 일러스트

블로그

기획과 화면 이야기

기획과 화면 이야기를 남깁니다.

블로그
화면설계

버튼을 눌렀을 때 일을 적어 두는 이유

버튼을 눌렀을 때 일을 적어 두는 이유

버튼을 눌렀을 때 일어나는 일은 눈에 안 보여요. 그래서 적어 두지 않으면 화면마다 다르게 만들어져요.

같은 「예약하기」 버튼인데 어떤 화면에서는 예약이 되고, 어떤 화면에서는 목록으로 돌아가면 고객이 헷갈려요.

버튼의 동작을 적어 두는 것은 화면 설계에서 빼놓을 수 없는 일이에요

플랜디는 25년차 기획자가 만든 AI 기획 도구예요.

버튼은 보여도 눌렀을 때 일어나는 일은 안 보여서 헷갈리는 모습
버튼은 보여도, 눌렀을 때 일은 안 보여요

안 보이는 것은 적어 둬야 해요.

동작을 적는다는 것은 무엇인가요?

버튼의 동작이란, 버튼을 눌렀을 때 일어나는 일이에요. 화면에 보이는 글자와 색이 아니라, 누른 다음에 벌어지는 일이에요.

고객이 버튼을 기억하는 것은 눌렀을 때 일이에요.

보이는 것 안 보이는 것
버튼의 글자와 색이에요 누르면 어디로 가는지예요
버튼의 위치예요 누르면 무엇이 바뀌는지예요
버튼의 모양이에요 실패하면 어떻게 되는지예요

동작은 눈에 안 보이라서, 적어 두지 않으면 만드는 사람마다 다르게 만들어요. AI에게 시킬 때도 마찬가지예요.

AI는 보이는 것만 보고, 안 보이는 것은 그때그때 지어내요.

보이는 것은 보고 안 보이는 것은 적는 모습
보이는 것은 보고, 안 보이는 것은 적어요
둘 다 있어야 화면이 완성돼요

동작이 갈라졌는지 확인하는 순서

1단계. 같은 글자의 버튼을 모아 봐요

화면 목록에서 글자가 같은 버튼을 찾아요. 「예약하기」가 여러 화면에 있으면 다 모아 봐요.

화면이 많으면 목록에서 찾아요.

2단계. 눌렀을 때 일을 말로 해 봐요

버튼마다 눌렀을 때 일어나는 일을 말로 해 봐요. 「누르면 예약 확인으로 가요」처럼요.

말로 해 보면 애매한 게 보여요.

3단계. 말이 다른 버튼을 표시해요

같은 글자인데 말이 다르면 표시해 둬요. 그 버튼이 갈라진 버튼이에요.

표시한 버튼이 이번에 적을 대상이에요.

4단계. 표시한 것부터 적기 시작해요

표시한 버튼부터 동작을 한 줄로 적어요. 한 줄이면 충분해요.

적는 순서는 다음 글에서 자세히 봐요.

한계

동작을 적는다고 모든 것이 해결되지는 않아요. 적는 것은 시작일 뿐이에요.

적어 둔 뒤에도 화면이 바뀌면 다시 고쳐야 해요. 그래도 적어 두면 어디가 달라졌는지가 보여요.

안 적으면 달라진 것조차 안 보여요. 적어 둔 것은 나중에 고치기도 쉬워요. 기록은 화면 설계의 반이에요.

자주 묻는 질문

동작은 화면 설계에 꼭 들어가나요?

네, 들어가요. 눈에 안 보이는 것은 적어 두지 않으면 만드는 사람마다 다르게 만들어요.

화면 설계는 보이는 것뿐 아니라 안 보이는 것도 정하는 일이에요. 보이는 것만 정하면 반쪽짜리 설계예요.

버튼 글자만 같으면 되나요?

아니에요. 글자가 같아도 동작이 다르면 다른 버튼이에요.

고객은 글자가 아니라 눌렀을 때 일로 버튼을 기억해요. 글자가 버튼의 전부가 아니에요.

말부터 맞추는 것은 공통 규칙 한 장 글에서 볼 수 있어요.

AI가 알아서 맞춰 주지 않나요?

아니에요. AI는 보이는 것만 보고 만들어요.

동작을 적어 두지 않으면 화면마다 그럴듯한 동작을 새로 지어내요. AI는 적어 준 것만 믿어요.

동작은 언제 적나요?

화면을 시키기 전에 적어요. 화면을 다 시킨 뒤에 적으려면 화면마다 다시 뜯어봐야 해요.

미리 적어 두면 시킬 말이 짧아져요.

오늘 내용 정리

  1. 버튼을 눌렀을 때 일어나는 일은 눈에 안 보여요.
  2. 보이는 것은 보고, 안 보이는 것은 적어요.
  3. 화면을 시키기 전에 적어요.

동작을 적는 순서가 궁금하다면

버튼마다 「누르면 → 이렇게 돼요」를 한 줄로 적는 순서는 다음 글에서 이어져요. 눌렀을 때 일어나는 일을 기록하는 순서

아이디어 한 줄이면 시작됩니다

로그인 없이 기획 인터뷰를 해보고, 막히면 문의로 이어가면 됩니다

문의

새 기획을 열려면 기획권이 필요해요

기획권 1개 = 새 기획 열기(IA 포함) + 화면 20장

가입하면 체험 프로젝트를 드려요

가입하면 체험 프로젝트 1개로 IA와 화면 5장까지 이어서 써 볼 수 있어요. 화면 20장과 파일 내려받기는 기획권으로 열어요.

무료로 가입하기

기획권 요금 자세히 보기