background
name

++;담다

새로운 것을 끊임없이 담고 담을
첫번째 포트폴리오

  • 사용성을
  • 지식을
  • 이야기를
담다
  • frame frame
  • frame frame
  • frame frame
  • shadow
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
  • ball
arrow

새로운

지식을

담다

갖고 있는 것에 한계를 두거나 안주하지 않고
새로운 지식과 재능을 담는 디자이너 신연주 입니다.
profile
task skill

about me

about me

line
About Me
디자인을 향한
이야기를을 담다

이런 디자이너가 되고싶습니다.

직관성이 뛰어난
웹디자인에 매료되었습니다.


내가 모니터에서 보고 표현한 색상과 형태가 그대로 사용자에게 전달된다는 웹디자인의 장점은 저에게 크게 다가왔습니다.
클라이언트와 유저간의 통역

저는 디자인은 하나의 언어라고 생각합니다.
클라이언트의 요구사항을 유저에게 효과적으로 전달하는 훌륭한 통역 역할의 디자이너로 성장하고 싶습니다.
단순하고 강력하게

디자인은 임팩트라고 생각합니다.
한 눈에 전달하고자 하는 메시지를 단순하고 강력하게 도출해낼 줄 아는 디자이너가 되고싶습니다.
clear

이런 경험을 하였습니다.

about me

about me

about me

line
UI Design
편리한 사용성을 담다
moniter
  • web ui image
  • web ui image
  • web ui image
  • web ui image
  • web ui image
FRAGRANCE BRAND
당신의향
web ui image

Sub Page

sub page
sub page
sub page
sub page
sub page
sub page
sub page
sub page

Overview

시안작업 : 9일 / 코딩작업 : 5일 [하드코딩]
참여율 : 시안 80% / 코딩 85%
작업형태 : Branding
특징 : 반응형, 로고디자인, 메인슬라이드
유저가 원하는 향을 원하는 형태로 담아준다는 모토를 가진 브랜드 사이트입니다. 브랜드 로고부터 사이트 컨텐츠까지 모두 기획하고 제작하였습니다. 타겟은 sns에 사진을 공유하길 좋아하는 유저로 설정하였고 사진공유가 많이 이루어질 수 있도록 깔끔하고 모던한 느낌의 디자인 컨셉으로 진행하였습니다.
프로젝트 기획 프로세스 브랜딩 페이지 확인하기
ui1 concept
JUCIE BRAND
OJUCIE
web ui image

Overview

시안작업 : 2일 / 코딩작업 : 5일 [하드코딩]
참여율 : 100%
작업형태 : Responsive Web
특징 : 반응형, 컨셉브랜드
신선한 이미지를 전면에 내세워 상큼하고 시원한 브랜드 이미지를 구축하였습니다. 화면의 해상도에 따라 부드럽게 전환되는 반응형으로 제작하였으며 컴퓨터, 태블릿, 모바일 3가지 단계로 제작하였습니다. 모든 화면에서 슬라이드와 하단 정보부분이 함께 보일 수 있도록하여 스크롤 유도를 하였습니다.
반응형 페이지 확인하기
COFFEE BRAND
TOWSOME
web ui image

Overview

시안작업 : 2일 / 코딩작업 : 5일 [하드코딩]
참여율 : 100%
작업형태 : Responsive Web
특징 : 반응형, 리뉴얼
상단에는 이벤트 화면을 풀스크린으로 배치하여 브랜드의 이미지와 카피를 보이도록 하였습니다. 스크롤하여 하단으로 내려가면 브랜드의 주요 상품에 대한 정보를 카드 형태로 접근 할 수 있도록 하였습니다. 화면의 해상도에따라 부드럽게 전환되는 반응형으로 제작하였으며 컴퓨터, 태블릿, 모바일 3가지 단계로 제작하였습니다.
반응형 페이지 확인하기
COSMETIC BRAND
3CE
web ui image
effect

Sub Page

sub page
sub page

Overview

시안작업 : 7일 / 코딩작업 : 7일 [하드코딩]
참여율 : 100%
작업형태 : Renewal
특징 : 레이아웃 디자인, 배너디자인
코스메틱 브랜드 사이트의 상큼한 색감을 강조했고, 배경에는 화장품 텍스쳐 느낌의 브러쉬 패턴을 과감하게 배치하여 자유스럽고 화려한 느낌으로 디자인하였습니다. 배경과 색감에 맞추어 레이아웃도 박스형태에서 조금 탈피하여 자유스러운 느낌을 주었습니다.
리뉴얼 페이지 확인하기
NATIONAL ARBORETUM
국립수목원
web ui image
effect

Sub Page

sub page
sub page
sub page
sub page

Overview

시안작업 : 10일 / 코딩작업 : 6일 [하드코딩]
참여율 : 100%
작업형태 : Renewal
특징 : 원페이지 스크롤, 레이아웃 디자인
국립수목원의 예약하기 콘텐츠에 쉽게 접근이 가능하도록 제작하였습니다. 예약페이지를 메인에서 바로 접근할 수 있도록 하였고 그 외 수목원 프로그램 신청도 좀더 접근이 쉽도록 하였습니다.
리뉴얼 페이지 확인하기
moodboard
FOOD BRAND
자연의속삭임
web ui image
effect

Sub Page

sub page

Overview

시안작업 : 5일 / 코딩작업 : 2일 [하드코딩]
참여율 : 100%
작업형태 : Renewal
특징 : 탭메뉴, 배너디자인, 컨텐츠 기획
음식 브랜드인만큼 식욕을 돋굴 수 있는 색상 컨셉으로 제작한 사이트입니다. 전달해야하는 이미지와 내용이 많았기 때문에 최대한 깔끔한 레이아웃 방향으로 작업했습니다. 컨텐츠 부분에서는 기존 브랜드에서 강점으로 꼽을만한 자체제작 상품을 전면에 배치하였고 고객 후기를 메인 하단에 배치하여 새로운 유저의 신뢰를 높일 수 있도록 하였습니다.
리뉴얼 페이지 확인하기
moodboard
FRAGRANCE BRAND
JOMALONE
web ui image
effect

Sub Page

sub page

Overview

시안작업 : 3일 / 코딩작업 : 4일 [하드코딩]
참여율 : 100%
작업형태 : Renewal
특징 : 풀스크린, 서브페이지 마우스호버 효과
브랜드의 제품이 가장 돋보일 수 있는 방향으로 디자인하였습니다. 제품의 이미지를 크게 넣고 그 외 이미지와 타이포를 간소화 한 레이아웃을 제작하였습니다. 화면 전체에는 두줄의 사각 틀을 스크롤시에도 픽스되도록 하여 조말론 브랜드 이미지를 부여하였습니다.
리뉴얼 페이지 확인하기
WATCH BRAND
TISSOT
web ui image
effect

Sub Page

sub page

Overview

시안작업 : 7일 / 코딩작업 : 8일 [하드코딩]
참여율 : 100%
작업형태 : Renewal
특징 : 풀스크린, 페이지 모션
고급 시계의 세련된 이미지에 맞추어 얇은 폰트타입과 가벼운 여백을 사용하였습니다. 여백이 많아 자칫하면 단조로워 보일 수 있었기 때문에 각 페이지마다 슬라이드, 마우스 호버 효과, 스크롤 등의 작은 모션이 발생하도록 디자인 하였습니다.
리뉴얼 페이지 확인하기

about me

line
Smart Device Design
직관적인 아이콘을 담다

Smart Device
UI Design

background pattern background pattern
간결하고 명확하게
smart device
smart device
smart device
smart device

title

mobile
도시적인 디자인
공항의 도시적인 느낌을 주기위해 얇은 선만을 사용하여 픽토아이콘으로 심플한 느낌을 강조하였다.

매일하는 그 고민,
해결해드립니다.
뭐 먹을까

Target

매일 나가서 식사를 골라서 해결해야하는 사용자.
메뉴선택에 결정장애를 가진 사용자.

#결정장애  #점심메뉴  #직장인메뉴  #뭐먹을까

ui mockup
ui mockup
ui mockup
ui mockup
icon

Walking

 지정된 시간 내에 일정 걸음수를 채우도록 도와주는 걷기 트레이닝 어플리케이션이다. 속도 페이스를 조절해 주는 화면을 제공하여 적정 속도로 코스를 돌 수 있도록 한다.

  • 걸음수

  • 칼로리
    소모량

  • 코스선택

  • 챌린지

  • 데이터

  • 교육영상

  • 설정

Walking mockup
Walking mockup
Walking mockup

about me

line
Graphic Design
섬세한 디테일을 담다

about me

town_1 town_2 town_3 town_4
tree tree tree tree

Good morning Town!

Good Afternoon Town!

Good Evening Town!

Good Night Town!

sun
ferris1_rotate ferris1_rotate ferris1_rotate ferris1_rotate ferris1_rotate ferris1_rotate
ferris1_frame ferris1_fix
ferris2_rotate ferris2_rotate ferris2_rotate ferris2_rotate ferris2_rotate ferris2_rotate
ferris2_frame ferris2_fix
ferris3_rotate ferris3_rotate ferris3_rotate ferris3_rotate ferris3_rotate ferris3_rotate
ferris3_frame ferris3_fix
ferris4_rotate ferris4_rotate ferris4_rotate ferris4_rotate ferris4_rotate ferris4_rotate
ferris4_frame ferris4_fix
man man man man man man man man man man man blue car yellow car clean car green car red car balloon surf man

about me

hobby

about me

hobby

about me

hobby

about me

hobby

새로운 시작을 찾아 시작한 100일을 마치며.

#성공적   #웹공부의_확장   #자신에_대한_기대

100일간의 웹디자인 입문기를 자평해보자면 매우 성공적이였다고 할 수 있습니다.
어떤 이상을 갖고 웹디자인 분야에 뛰어든 것은 아니기에 작업을 진행하며 힘든 부분도 있었지만 실망은 없었습니다.

디자인 시안을 짜고 블럭을 쌓듯이 코딩으로 시안을 실제로 표현해내는 작업은 매우 흥미로웠습니다. 처음에는 마우스호버 효과도 신기하였고, 자바스크립트 제이쿼리를 배우며 웹에 모션을 더하는 작업을 알게되면서 웹디자인 영역을 작게나마 확장시키고 있는 중이입니다.

찾아보면 새로운 것이 계속해서 발견되는 이 분야에서 저는 어디까지 성장할 수 있을 지 기대가되고 또 더 공부하여 스스로를 끊임없이 스킬업하고 싶습니다.

포트폴리오를 모두 보셨습니다.
끝까지 봐주셔서 감사합니다.

신연주
zgdiy246@naver.com
82+ 10 7482 2388