본문 바로가기

진짜 전문가가 되기 위해!/디자인 연습

[디자인 - 연습] 웹디자인 연습(7) - 대구은행

*리뷰

  • 작업시간 > 2시간 
  • 선정이유 >
1. 간단하고 일괄적이고 규칙적인 레이아웃을 찾다가 선택함.
2. 일상적인 일에 변화가 생겨서 난이도가 낮은게 필요했음.

*오늘 깨달은 점


1. 전체을 한가지 기준으로 작업한게 아니고 각의 섹션에 규칙이 있는 것 같다.

2. 워낙에 빠른 접근성을 위해 만든 웹사이트라서 간격이 굉장히 크게 느껴진다.

 

****회고록
일단 일상일에 변화가 생겨서 일주일에 2번 정도로 끝낼 수 있는 홈페이지로 골랐다. 근데 하다보니 뭔가 내가 받아쓰기를 하고 있다는 느낌이 들었다. 전과 같이 한번은 기억만으로 연습하고 나머지 한번은 섹션별로 크기를 봐며 했는데 이게 맞는 건가 싶다. 그러나 확실히 실전에서 레이아웃을 짜는 실력이 올라가고 있다. 다만 색을 조합하고 배치하는 게 아직까지 어렵다. 해서 다음 연습부터는 분석에 우선순위를 찾는 것도 같이 해야할 것 같다. 그리고 왠만하면 분석 후 바로 연습에 돌입하는 게 좋을 것 같다.  카테고리별 연습이 필요해보인다. 

--다음 과제 시 해야할 목록
1. 분석후 바로 연습할 것 
2. 분석에 컨텐츠 우선순위도 넣을 것 
3. 난이도 있는 연습 홈페이지를 지정할 것 
4. 카테고리별 연습목록을 만들자!

*구성요소

 

1. 색상 > #07172A  #8D8D8D #F3F6F8 #006DDF

2. 폰트 > NOTO SANS

3. 아이콘

4. 그리드 >  colums 12 / margin 375 / gutter 24

5. 레이아웃 >


*분석

1. 왜 만들었을까?(목적)
-메인 페이지 라기에는 부족해 보이고 인트로 페이지가 아닐까 싶다 실제 메뉴를
누르면 행당 페이지로 이동하기 때문이다.

2.누구를 위해?

-기업은행도 있고 개인 은행도 있다.

단순 은행업무는 아니고 보다 복잡한 정보를 빠르게 찾기 위한 사람을 위한 페이지 같다.

3. 이런 컨텐츠는 왜 있을까?

-슬라이드는 소개용이고 그외는 사람들이 많이 이용하거나 홈페이지 유입용 컨텐츠 같다.

그래서 굉장히 직관적이고 간단하며 포인트만 색이 금방 요소를 찾을 수 있다.

4. 어떻게 구성을 했을까?
-해상도 > 적응형으로 1280px 까지만 제공하고 있다. 1920으로 작업하고 컨테이너가 1170px로 되어있다.
-그리드,레이아웃 > 12컬럼에 24커터 375마진은 이고 다단 레이아웃으로 그리드에 맞춰 1단 1단 4단 2단으로 되어있다.
-컬러 > #006dd #F2F6F9 메인 컬러가 포인트 컬러로만 쓰여지고 있다. 배경이나 박스는 흰색,파스텔톤으로 글씨나 이미지가 잘 보인다
-폰트 > noto-m 색깔이 연해서 조금만 가독성 있어도 잘보인다. 게다가 직관적으로 보이게 하기 위해 일반적인 폰트 크기보다 크다
-이미지스타일> 다른 스타일 요소가 굉장히 단순해서 3d로 분위기 전환을 시킨 것 같다.

 


*결과