더 나은 결제 페이지 디자인을위한 7 가지 팁
연말 연시가 다가 오면 많은 사람들이 온라인 쇼핑을 할 것입니다. (괜찮아 .. 아마도 쇼핑이 많을 것이다!) 웹 사이트의 결제 페이지는 그 경험을 기억하거나 잊어 버리기를 원하는 경험을 할 수있다.
체크 아웃 페이지를 디자인하는 경우 기능, 유용성, 보안 및 디자인과 같은 많은 고려 사항이 있습니다. 마지막 요소는 모든 디자이너가 영향을 줄 수있는 것입니다. 결제 페이지는 나중에 생각할 수 있도록 디자인해서는 안됩니다. 온라인 쇼핑 경험에서 가장 중요한 페이지 일 것입니다.
그것을 시각적으로 만드십시오
이것은 명백한 아이디어처럼 들릴 수 있지만 전자 상거래 페이지의 결제 페이지는 시각적이어야합니다. 웹 사이트가 너무 많으면 기본 형태로 바뀝니다.
여러 가지 이유로 중요합니다. 결제 페이지와 사이트의 나머지 부분을 시각적으로 연결하면 브랜드 신뢰성이 확립됩니다. 결제 페이지가 나머지 사이트처럼 보이면 안전하다고 느끼고 사이트에 속한 것 같습니다. 로고에서 장바구니의 항목에 이르기까지 시각적 요소를 통해 사용자는 웹에서 왜 그리고 어디에 있는지 기억할 수 있습니다. (세계의 많은 부분이 상당히 산만 한 인터넷 사용자 그룹임을 기억하십시오.)
어떤 종류의 영상을 사용해야합니까?
- 이미지. 최소한 모든 품목에는 사용자가 구매하는 것을 보여주는 아이콘이 있어야합니다.
- 로고. 회사 로고는 항상 명확하게 표시되어야하며 클릭하면 나머지 사이트로 돌아갈 수 있습니다.
- 큰 버튼. “장바구니에 담기”, “항목 업데이트”및“지금 구매”와 같이 크고 화려하며 시각적으로 호소력있는 행동을 유도하십시오. 버튼을 쉽게 찾아 클릭 할 수 있어야합니다.
- 색깔. 체크 아웃 페이지가 너무 많으면 개요 상자가있는 흰색입니다. 색상을 사용하는 것이 좋습니다. 결제 페이지에서 나머지 웹 사이트의 색 구성표를 유지하십시오.
- 타이포그래피. 텍스트는 단순하고 읽기 쉬워야합니다. (사람들은 단순한 세리프 또는 산세 리프 서체를 스크립트 나 참신 글꼴 이상으로“신뢰하는 경향이 있습니다.”그러나 더 큰 텍스트 요소로 재미를 느낄 수도 있습니다.
결제 로고 및 보안 도장 포함
사용자가 쇼핑에 대해 기분을 좋게 해주는 시각 자료를 포함시킵니다. 대부분의 사람들은 온라인에서 신용 카드로 결제 할 수 있다는 것을 알고 있지만 결제 버튼 옆에 작은 로고가 있으면이 아이디어가 강화됩니다.
사용자에게는 작지만 안심할 수있는 시각적 신호입니다. 어떤 유형의 지불이 허용되는지 혼동하지 않아도됩니다.
모든 결제 유형에 로고를 포함해야합니다. (대부분의 사이트는 신용 카드 로고를 기억하지만 PayPal 또는 Apple Pay는 잊습니다.) 이미지를 작게 유지하고 체계적으로 그룹화하십시오. 고맙게도 디자이너에게는 이러한 요소의 대부분이 작은 형식으로 잘 렌더링되고 종횡비가 비슷합니다.
이를 위해 특수 사용자 인터페이스 로고 키트를 디자인하거나 다운로드하십시오. 회사의 재고 로고에만 국한되지 않습니다. 디자인에 너무 열중하지 마십시오. 목표는 사용자가 화면에서 로고를 매우 작은 크기로 인식하는 것입니다.
이미지 확대 고려
사용자가 장바구니에있는 항목을 마지막으로 볼 수있는 체크 아웃 페이지는 큰 보너스입니다. 장바구니 또는 팝업의 각 항목을 확대하는 호버 효과를 사용하면 사용자가 마지막 구매를 한 번에 쉽게 볼 수 있으며 색상이나 크기를 확인하기 위해 다시 탐색해야하는 번거 로움을 제거 할 수 있습니다.
또 다른 옵션은 결제 페이지에서 항목에 대한 대형 축소판 이미지를 만드는 것입니다. 이 추가 이미지는 사용자가 쇼핑 선택을 확인하고 구매에 대해 더 나은 느낌을 줄 수 있도록 도와줍니다.
너무 많은 디자이너가 이미지를 전혀 포함하지 않아 카트를 쉽게 버릴 수 있습니다. 이러한 방식으로 생각하십시오. 결제시 이미지를 갖는 것은 실제 매장에서 줄을 서서 물건을 들고있는 것과 같습니다. 이 시점에서 많은 사람들이 마음을 바꾸지 않습니다.
테이블 사용
장바구니의 정보는 완벽하게 구성되어야합니다. 이를 달성하는 가장 쉬운 방법은 카트를 표 또는 유사한 그리드 기반 형식으로 디자인하는 것입니다.
열과 행을 사용하여 각 항목, 이미지, 설명, 수량, 가격 및 기타 관련 정보를 표시하십시오. 항목은 해당 행의 다른 정보와 함께 열에서 세로로 정렬해야합니다. 이 스타일의 정렬은 여러 항목이있는 카트에 필수적이므로 사용자가 화면을 위아래로 이동하지 않아도됩니다 (더 편안합니다).
각 테이블 또는 그리드 내에서 일관된 정렬을 사용하십시오. 왼쪽이 가장 일반적입니다. 화면에서 쉽게 볼 수 있도록 가격이 정렬되는 방식을 고려하십시오. 기간 전후의 숫자가 각 항목의 동일한 위치에 있도록 가격이 이상적으로 정렬되어야합니다.
기능에 대한 생각
체크 아웃 페이지 디자인의 전체 기능 중 많은 부분이 디자이너의 지시문이 아닐 수도 있지만 고려해야 할 사항입니다. 디자이너 나 개발자가 이러한 개념을 만드는지 여부는 팀마다 다를 수 있습니다.
디자인 요소가 필요한 주요 기능 문제는 다음과 같습니다.
- 체크 아웃 전후를 포함하여 여러 화면에서 쉽게 인쇄 및 인쇄 할 수 있습니다.
- 위시리스트 기능 또는 나중에 구입할 수 있도록 품목을 저장하는 다른 방법을 포함하십시오. 그 정보를 공유 가능하게 만드십시오.
- 너무 많은 결제 페이지가 쇼핑 경험의 다른 부분으로 다시 연결되지 않고 어두운 구멍이됩니다. 빠져 나올 수없는 페이지에 사용자를 잠그지 마십시오.
- 카트 내 항목 편집을 허용합니다.
- 인쇄 가능한 송장 옵션 또는 페이지를 고려하십시오. (고객이 비즈니스 고객을 포함하는 경우 특히 중요합니다.)
- 사용자가 주문을 수정, 변경 또는 업데이트하는 방법을 쉽게 이해할 수 있도록합니다. 많은 결제 페이지에는 각 항목 옆에 수량 카운터가 있습니다. 이 번호를 쉽게 편집 할 수있게하십시오 (자동으로 업데이트해야 함).
- 결제 후 계정을 쉽게 만들 수 있습니다. 모든 고객이 이전에 쇼핑 한 것은 아닙니다. 쉽고 빠르게 구매 한 다음 계정에 가입해야합니다. 먼저 판매를 은닉하십시오.
모든 페이지에 주요 아이콘이 표시되어야 함
결제 페이지 디자인을 생각하면 웹 사이트 컨셉에 전자 상거래 옵션이 포함되기 시작하는 순간부터 시작됩니다. 특정 디자인 요소는 전체 웹 사이트를 통해 전달되어야합니다.
장바구니에 추가하고 결제 페이지 아이콘은 디자인 전체에 걸쳐 있어야합니다. 버튼 또는 탐색 요소는 결제 페이지의 해당 동작 버튼과 동일한 디자인 (또는 상당히 유사)이어야합니다.
모바일 사용자 기억
데스크톱 컴퓨터가 아닌 모바일 장치에서 판매의 비율이 증가하고 있습니다. 결제 페이지 디자인과 이러한 고객의 사용 편의성을 고려하십시오. (체크 아웃 페이지까지 전화로 작동하는 웹 사이트보다 더 실망스럽고 너무 일반적인 것은 없습니다.)
탭 및 스 와이프를 염두에두고 요소를 디자인하십시오. 버튼은 더 크고보기 쉬워야합니다. 양식은 화면을 확대하지 않고 탭하기 쉽게 해주는 더 깊은 상자를 포함해야합니다.
모바일 사용자의 경우 모든 것을 단일 페이지에 유지하는 것이 중요합니다. 여러 화면을 넘기지 않고 스크롤하는 결제 페이지를 만듭니다.
결론
결제 페이지를 디자인하는 것은 모든 디자이너에게 큰 일이 될 수 있습니다. 핵심은 디자인 커뮤니티에서 자주 이야기하는 것입니다. 단순하게 유지하십시오. 최소한의 효과와 사용성에 중점을 둔 간단한 외곽선을 디자인하면 성공 가능성이 높아집니다.
결제 페이지를 생각할 때 사용자를 기억하십시오. 시각적 호소력, 사용자를 안내하고 알려주는 로고, 많은 이미지, 체계적인 레이아웃, 기능, 판매를 안내하고 홍보하는 아이콘 및 모바일 친화적 인 인터페이스가있는 페이지를 디자인하려고 노력하십시오.
크리에이티브 마켓 제공.
