PENNY PAGE
CASE 43NEARBY

내 근처에서 얻는 것부터 보여 주는
내 주변 혜택을 한곳에

컨셉 작업 — 위치 기반 혜택 플랫폼 기업을 가정해 만든 멀티페이지 사이트입니다.

업종
위치기반 O2O 플랫폼
형태
컨셉 시안 · 멀티페이지 기업 사이트
구성
메인 · 서비스 상세 3종 · 회사소개 · 채용
뉴스 · 문의 · 약관/개인정보
기술 스택
멀티페이지 HTML/CSS · Vanilla JS · HTML5 배경 영상 · IntersectionObserver
NEARBY 데스크탑·모바일 화면
PENNYPAGE WORKS · CASE 43

01과제

무엇을 받았고, 무엇을 했나

위치 기반 서비스는 내 근처에서 무엇을 얻는지가 먼저 보여야 합니다. 그래서 니어스왑·니어딜·니어코드 세 서비스를 카드로 나누고, 서비스별 상세 페이지와 회사소개·채용·뉴스 페이지를 멀티페이지로 연결했습니다.

HTML5 배경 영상을 쓴 다크 지도 톤 히어로와 그린 포인트 컬러로 브랜드를 통일한 기업 사이트로 구성했습니다.

핵심 — 세 서비스, 세 갈래물물교환·할인·초대코드 세 서비스를 카드와 상세 페이지로 나눠, 원하는 혜택으로 바로 들어가게 했습니다.

02화면

히어로가 아니라 실제로 일하는 구간

3대 서비스 카드 — 니어스왑·니어딜·니어코드
013대 서비스 카드 — 니어스왑·니어딜·니어코드
회사 소개 · 비전
02회사 소개 · 비전
최신 소식 카드
03최신 소식 카드
문의 폼
04문의 폼

03구성

이 사이트에 들어간 것

  • 01
    배경 영상 히어로HTML5 video · 다크 지도 톤
  • 02
    3대 서비스 카드니어스왑·니어딜·니어코드
  • 03
    서비스 상세 3페이지서비스별 개별 페이지
  • 04
    숫자 카운트업IntersectionObserver
  • 05
    뉴스 카드카테고리 태그·날짜
  • 06
    회사소개 · 채용 페이지멀티페이지 연결
  • 07
    문의 폼문의 유형 선택
  • 08
    약관 · 개인정보 페이지푸터 연결
NEARBY 모바일 전체 화면

모바일 · 스크롤해서 보기

컨셉 작업입니다.

특정 고객 없이 업종 문법을 연구하려고 만든 시안입니다.