FAQ 아코디언

유사도 (통과 70점)
8/10

연한 파란빛 그라데이션 배경 한가운데에 폭이 넓지 않은 흰색 카드가 하나 떠 있고, 모서리가 크게 둥글며 아래로 부드러운 그림자가 퍼져 있어요.

카드 맨 위에는 제목보다도 큼직한 이모지 하나와 굵은 제목 한 줄, 그리고 질문을 눌러 보라고 안내하는 회색 문구 한 줄이 위에서부터 가운데 정렬로 놓여요.

그 아래에는 질문 세 개가 세로로 쌓이는데, 선으로 이어 붙인 하나의 목록이 아니라 항목마다 연한 회색 테두리를 두른 둥근 상자로 따로 떨어져 있고 상자 사이에는 일정한 간격이 있어요.

각 상자의 윗줄은 상자 폭을 꽉 채우는 버튼이고, 왼쪽에는 질문 문구가 조금 굵은 글씨로 왼쪽 정렬되며 오른쪽 끝에는 아주 옅은 남보라색 동그라미 안에 진한 남보라색 플러스 기호가 붙어 있어요.

처음에는 세 항목이 모두 접혀 있어서 질문 줄만 보이고 답변은 하나도 보이지 않아요.

질문 줄에 마우스를 올리면 배경이 아주 옅은 회색으로 바뀌고, 누르면 같은 상자 안 질문 바로 아래에 조금 작고 옅은 회색 글씨로 짧은 답변 한 줄이 나타나요.

이때 플러스는 마이너스로 바뀌고 동그라미는 진한 남보라 바탕에 흰 기호로 뒤집히며, 상자 테두리도 연보라로 물들고 은은한 보랏빛 그림자가 생겨요.

다시 누르면 접히고, 항목끼리 서로 영향을 주지 않아서 여러 개를 동시에 열어 둘 수도 있어요.

목표 화면을 보고, 만들고 싶은 것을 자연어로 설명해 보세요. 자세히 설명할수록 유사도가 올라가요.

목표 화면은 로그인 없이 볼 수 있어요. 직접 만들어 보려면 로그인이 필요합니다.

로그인하고 만들기