Your SlideShare is downloading. ×
  • Like
Ia
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply
Published

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
369
On SlideShare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
2
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. web site IA construction
  • 2. 건축학 개론, 그리고 IA :: 웹 서비스, 웹 사이트 전체 체계를 구조화하는 것 :: 레이아웃 구조의 기준
  • 3. IA는 과일가게의 display :: 가장 잘 팔리는 것을 보기 좋은 자리에 :: 가장 싱싱하고 예쁜 것을 잘 보이는 상단에
  • 4. IA의 구성 정보의 구조화 네비게이션 레이블링 width x depth  폭(Width): 최소 5개~최대 9개까지의 메뉴(Function),  깊이(Depth): 최대 5단 이하로 제한 검색(searching function) 이용자 위치 정보(context) 방문정보의 표시 네비게이션 막대(navigation bar) 제목 붙이기(labeling)
  • 5. practice: 테디베어 분리하기 :: 한 마리의 테디베어가 어떤 구성으로 만들어 지는가
  • 6. width depth
  • 7. 2013-09-03 번호 메뉴명 코드 폴더 페이지명 작업(완료 예정일 또는 실제 완료일) 1depth 2depth 3depth 4depth 5depth storyboard design coding program 01 네이버 / 01 GNB /gnb 01 로그인 10101 login 2012-01-02 2012-01-13 2012-01-15 2012-01-16 02 블로그 /blog 01 Front /front 01 prologue 1020101 prologue 2012-01-04 2012-01-15 2012-01-19 2012-01-25 02 blog 01 뷰 페이지 0102010201 view 2012-01-15 2012-01-16 2012-01-19 2012-01-23 02 글작성/수정 페이지 0102010202 write 2012-01-15 2012-01-16 2012-01-19 2012-01-22 03 photolog 01020103 photolog 2012-01-15 2012-01-16 2012-01-19 2012-01-25 02 Admin /admin 01 관리 /manage 01 기본설정 0102020101 set 2012-01-19 2012-01-20 2012-01-26 2012-01-26 02 통계 01020202 /statistics view 2012-01-22 2012-01-25 2012-01-26 2012-01-27 총 6 7 7 7 7 7 완료(수) 7 0 0 0 완료율(%) 100 0 0 0 IA 예시
  • 8. 단순구조의 layout * 단순구조: 정보설계가 단순한 웹사이트 구조 메인과 서브 페이지의 구조가 동일하게 적용 type 1. 상단 네비  70~80% 정도로 사용→높은 사용자 편리성  컨텐츠의 양이 많은 대기업에서 사용
  • 9. 단순구조의 layout type 2. 좌측 네비  인터넷 초창기부터 사용  우측 컨텐츠 영역의 레이아웃 구성 시 고려사항  컨텐츠의 양이 적거나 네비게이션의 정보 설계 부분 컨텐츠가 중요할 경우
  • 10. 단순구조의 layout type 3. 우측 네비  시각원리에 의한 낮은 사용률  컨텐츠 및 비주얼을 강조해 전달 시
  • 11. 단순구조의 layout type 4. 하단 네비  디자이너의 의도에 따라 창의적인 페이지 연출 가능  주로 영화사이트 및 패션 사이트에서 활용
  • 12. IA, 그리고 메뉴 구조도  메뉴 구조도는 IA 문서 중 메뉴명으로 노출되는 부분을 계층적으로 작성한 것  조금 더 시각적이고 웹사이트의 사용자 입장에서 무엇을 보게 될지 가늠할 수 있는 문서  메뉴 구조도는 메뉴 구조만을 표현할 뿐 구체적 정보는 표현 불가
  • 13. 감사합니다.