포트폴리오 목록

LAMPHOUR 램프아워 조명 전문 쇼핑몰 디자인

분야: 디자인 · 퍼블리싱 / 웹 / 쇼핑몰, 카페24, 반응형 참여 기간: 2026.10 관련 기술: 카페24 스마트디자인, HTML5, CSS3, JavaScript, 반응형 웹 [프로젝트 개요] 스탠드, 펜던트, 전구를 파는 조명 전문 몰입니다. 어두운 바탕에 앰버 한 색을 써서 해 진 뒤의 거실을 떠올리게 했고, 색온도와 밝기, 소비전력, 연색성 숫자를 크게 보여 감으로 사지 않게 했습니다. 첫 화면 색온도 슬라이더 아래로 색온도로 고르기, 밝기 계산기, 전구 교체, 시간마다 다른 빛 장면, 후기가 이어집니다. [주요 기능] 1. 색온도 슬라이더 첫 화면 - 큰 K 숫자와 슬라이더를 두고, 밀면 숫자 색과 사진 속 빛 색, 아래 스펙 표가 함께 바뀝니다. 2. 색온도 눈금 - 색온도 그라데이션 막대 위에 상품 사진 원을 K값 자리에 놓고, 눈금이나 탭을 누르면 진열이 그 색온도로 걸러집니다. 3. 스펙 표 카드 - 상품 카드에 K, lm, W, Ra 네 칸과 색온도 칩, 디밍 표시를 붙였습니다. 4. 밝기 계산기 - 방 종류와 넓이를 고르면 필요한 밝기가 나오고 조명 조합 목록과 합계 가격, 조합 모두 담기 버튼이 이어집니다. 5. 시간마다 다른 빛 - 저녁 거실, 밤 침실, 아침 현관 장면마다 색온도와 쓰인 상품을 보여 줍니다. [디자인] - 어두운 바탕과 짙은 면에 앰버 한 색을 할인율과 순위, 주 버튼에 썼고 색온도 칩 네 색은 데이터 표시에만 씁니다. - IBM Plex Sans KR 한 서체로 가는 큰 숫자와 작은 스펙 글자를 나눴습니다. - 조명이 켜진 사진이 돋보이도록 선과 면을 낮은 대비로 맞췄습니다. [범위] - 메인 페이지 PC·모바일 반응형 디자인과 퍼블리싱 - 상품 카드는 반복 구조로 짜서 카페24 메인 진열 모듈로 옮길 수 있는 구조

LAMPHOUR 램프아워 조명 전문 쇼핑몰 디자인 화면 1LAMPHOUR 램프아워 조명 전문 쇼핑몰 디자인 화면 2LAMPHOUR 램프아워 조명 전문 쇼핑몰 디자인 화면 3

이런 프로젝트를 준비하고 계신가요?

이 사례로 상담하기

만들고 싶은 서비스가 있나요?

AI 상담에서 비슷한 사례와 진행 방식을 바로 물어보세요. 연락처를 남기시면 담당자가 직접 연락드립니다.