brunch

You can make anything
by writing

C.S.Lewis

by 독학기획러 May 30. 2023

UI에 쓰이는 용어를 정리해봤다! -2-

with 앱의 화면을 구성하는 것들

  UI이미지에는 버튼이나 박스 형태 뿐 아니라 화면 자체를 구성하는 것도 알아둬야 한다 생각한다. 화면 구성에 따라 매출을 올릴 수 있는 광고 배너를 기획할 수도 있고 정보를 효율적으로 알릴 수 있는 방법을 알수도 있을 것이라 판단했다. 그래서 몇가지 화면 구성에 대해서 알아보고 이에 대한 사례들을 조사해봤다.


스플래시
1번 : 파파고 앱 / 2번 : 자소설닷컴 앱 / 3번 : 포켓씨유 앱

  스플래시는 앱을 키면 처음에 나오는 화면으로 앱의 로고가 나오는 경우가 대부분이다. 그치만 자소설닷컴처럼 광고의 이미지가 나오는 경우도 종종 있기 마련이다. 이런 경우 노출도가 굉장히 높기때문에 해당 게재면에 나오는 광고의 경우 단가가 높은 경우가 많다. 자사의 프로모션을 하는 경우로도 쓰인다. 포켓씨유에 쓰인 방법처럼 자사가 가장 보여주고 싶은 프로모션을 스플래시에 써서 노출도를 크게 올리기도한다.


코치마크/툴팁
좌측 : 티멤버십앱 (코치마크) / 우측 : 네이버 앱 (툴팁)

  코치마크는 앱을 처음 실행할 시 사용방법이나 사용단계를 알려주는 화면으로 볼 수 있다. 좌측의 티멤버십 앱처럼 처음 창을 들어가게 되면 각 메뉴나 버튼들이 어떤걸 의미하는지 모르는 유저들을 위해 사용방법을 설명해준다.

툴팁은 부연설명을 해주는 것으로 우측의 네이버 앱처럼 사용방법이나 새롭게 업데이트 된 사항이 있으면 이를 설명해주는 문구가 뜨게 된다.


모달
1번 : 애플와치 앱 / 2번 : 포켓씨유 앱 / 3번 : 29cm앱

  모달은 같은 브라우저 내에 상위 레이어를 띄우는 것을 의미한다. 이렇게 띄워진 레이어는 여러 용도로 쓰이게 되는데, 일반적으로는 1번 이미지처럼 어떠한 정보를 알려주는 창으로 쓰인다. 그 외에 포켓씨유처럼 무언가를 구매하거나 상호작용하는 상황으로도 쓰이며, 29cm처럼 프로모션 용도로도 쓰일 수 있다.


캐러셀
좌측 : 포켓씨유 앱 / 우측 : 29cm 앱

  캐러셀은 슬라이드 형태로 이미지 또는 영상을 순환시켜 보여주는 것을 의미한다. 위의 두 이미지처럼 무언가를 알리는 용도로 가장 많이 쓰이게 되며 대부분 배너형으로 이루어진다.

작가의 이전글 UI에 쓰이는 용어를 정리해봤다!
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari