II. 교실수업과 웹교육
1. 웹디자인의 개념
1.3 UI 구성원리
1) 일관성
일관성은 처음부터 끝까지 한결 같은 성질을 말한다. 한결같은 웹 사이트의 성 질을 유지하기 위해서는 네비게이션 할 수 있는 각종 장치(버튼의 위치, 모양, 크 기 등), 페이지 레이아웃, 컬러, 레이블링 등의 계획이 일관성 있게 유지되어야 3) Web Design 2001.1. 78p
한다.
일관된 사용자 인터페이스는 사용자가 사이트의 구조를 쉽게 학습 할 수 있어 편리하게 정보를 찾아 갈수 있을 뿐 아니라 사용자들의 네비게이션하는 패턴이 일관되기 때문에 다음 행동 예측까지 가능하게 된다. 이러한 예측은 사이트 제 작자들에게 사용자 중심의 인터페이스 설계를 가능하게 하며 사용자들에게는 무 의식적으로 사이트를 이해할 수 있도록 도와준다. 또한 실생활과의 연관성을 가 져다주는 메타포를 응용함으로서 실생활과의 일관성을 부여하는 방법을 사용』도 한다.
웹에서의 메타포란 실제 생활에서의 행동, 사고, 사물 등을 인터페이스를 통해 은유하는 것을 말한다. 사용자는 실생활에서의 행동양식을 웹에서 체험함으로서 친근감 있는 웹 사이트로 기억하게 된다. 한마디로 웹 사이트의 일관성을 원활한 의사소통을 위한 첫 번째 요소이며 웹 아이덴티티 형성에 큰 영향을 미친다.
2) 사용 편의성
웹 사이트는 사용자가 중심이다. 쉽고 편리한 웹 사이트는 이용하면서 아무런 어려움도 느끼지 못하도록 사용자 중심으로 설계하며 사용자들에게 편리한 사용 환경을 제공해준다. 그렇기 때문에 사용자들은 쉽고 편리한 웹 사이트에는 자주 방문하고 오랫동안 머물게 되나 반면에 어렵거나 불편한 웹 사이트는 바로 떠나 게 된다.
사용자들에게 좀 더 친근하고 편리한 웹 사이트를 설계하기 위해 사용성 테스 트를 실시하는데 이것은 웹 사이트의 편의성 설제를 측정하기 위한 것이다.
사용 편의성에 대한 중요성은 아무리 강조해도 지나치지 않는다. 이것은 사용 자로 인해 생명력을 가지기 때문이며, 인터페이스는 사용자가 원하는 작업을 원 활 히 하기 위하여 제공되어야 한다.
3) 학습 용이성
학습성이라는 것은 해당 사이트를 처음 방문했거나 익숙하지 않은 사용자들이 얼마나 쉽고 빠르게 사이트의 사용법을 배울 수 있는가에 관한 것이다. 일관성이
있고 사용이 편리한 사이트는 그 사용법에 대해 쉽게 학습하게 되어 사이트의 이 해도를 높여준다
그 외 Ul디자인 구성원리에는 의사 소통성, 경제성, 접근 가능성 등이 있다.
1.4. Ul 구성요소
4)1) 네비게이션
서핑이란 것을 하다 종종 길을 잃는다. 해당 웹 사이트를 직접 제작, 운영하는 사람이 아닌 이상 사용자가 접속한 웹 사이트의 맵, 그 구조를 한눈에 알아차리 고 원하는 페이지, 원하는 정보로 바로 가기란 쉬운 일이 아니다.
좋은 네비게이션을 위한 몇 가지 고려사항을 알아보면 다음과 같다.
가) 해당 웹 사이트이 성격에 맞는 네비게이션 시스템을 고려한다.
계층적인 네비게이션 성격으로 작업할 것이냐 전체적으로 글로벌한 네비게이 션 구조로 작업할 것이냐를 웹 사이트의 성격과 컨셉에 맞게 결정한다. 앞서 말 한처럼(네비게이션시스템) 컨텐츠가 많고 복잡한 웹 사이트 일수록 네비게이션 시스템의 신중한 설계는 꼭 필요하다.
나) 적절한 레이블과 메타포 사용
레이블과 메타포는 연상 작용을 유도한다. 사용자들로 하여금 적절한 연상 작 용을 유도하여 보다 빠르게 정보를 파악하고 네비게이션 할 수 있도록 한다.
다) 정보의 카테고리별로 메뉴를 구분하여, 정보의 체계를 나눈다. 정보의 체계 를 잡는 일은 아주 중요하다. 뉴스사이트처럼 매일매일 많은 정보가 쏟아져 나오 는 웹 사이트의 경우 정보의 체계가 잘 잡혀 있지 않다면 네비게이션시 많은 어 려움이 따를 것이다.
라) 일관성있는 네비게이션은 사용자들이 예측을 유도하여 원하는 정보로의 접 근을 도와준다.
마) 웹 사이트의 내용과 구조를 한눈에 파악할 수 있는 사이트맵을 사용한다.
4) www .www -info. co .krfspec 12.Mm
* 성공적인 네비게이션을 위한 10가지 조건5)
- 쉽게 익힐 수 있어야 한다.
- 일관성이 있어야 한다.
- 피드백을 제공해야 한다.
- 문맥으로 표시되어야 한다.
- 대안을 제시해야 한다.
- 행동과 시간을 절약할 수 있어야 한다.
- 명확한 시각적 메시지를 제공해야 한다.
- 명확하고 이해할 수 있는 레이블을 제공해야 한다.
- 사이트의 목적에 적합해야 한다.
- 사용자의 목적과 행동을 지원해야 한다.
위의 사이트는 정보의 분류 체계가 잘 잡혀 있어 정보의 양이 많지만 쉽게 네 비게이션 할 수 있다.
2) Metaphor
적절한 정신모형의 형성을 도울 수 있는 해결책중 하나는 시각적이고 역동적인 5) 『성공적인 웹 사이트 구축을 위한 네비게이션』 - 한빛미디어
그림 1 네비게이션구조가 잘 짜여진 사이트(www.cnet.com)
사용자 인터페이스 은유(user interface metaphor)의 이용이다. (Dingelde 1994) 은유(metaphor)는 사용자 인터페이스에서 사용자가 시스템이 어떻게 작용하는 지에 대한 적절한 정신모형을 재빨리 채택하도록 하여 사용자가 해야하는 시템템 -특정적인 학습의 양을 최소화 시키는데 사용되는 유추적 모형이다. (Caroll and Mack, 1985)
가) 메타포
실생활에 있어서 사람들이 생각하고 행동하고 있는 것을 사용자 인터폐이스를 통해 은유하는 것을 말한다. 예를 들어 컴퓨터의 파일관리를 실생활에 있어서 서 류를 관리하는 종이 폴더를 사용하는 것처럼 하는 것 또는 파일들을 삭제할 때 실생활에서 휴지통의 개념을 도입한 것을 은유(메타포)라고 한다.
나) 적절한 메타포
메타포를 이용하여 실생활에서의 사고체계를 웹 사이트에 적용시킨다면 보다 편리하게 네비게이션 할 수 있을 것이다. 주로 메뉴버튼이나 검색, 홈으로 가는 버튼 또는 게시판의 기능 버튼 등을 제작할 때 이 메타포를 사용하여 이미지를 그리게 된다. 주의점은 사용자가 인식하기 쉬운 직관적인 이미지여야 메타포의 효과를 볼 수 있으며 지나치게 정교하거나 복잡한 이미지일 경우 오히려 역효과 를 볼 수 있다. 이러한 메타포는 사이트의 특성, 성격, 컨셉을 표현하는 중요수단 이 될 것이다.6)
6) www.bonwebdesign.com/html/webuser2.htm
그림 2 메타포를 이용한 메뉴 Metadesign(www .metadesign.com)
다) 가독성
타이포그래피의 기능적 측면의 하나로, 문자가 잘 읽혀지는 정도 흑은 문장의 내용이 쉽게 전달되는 정도를 말한다. 여기에는 두 가지 요소가 작용한다. 즉 리 더빌리티(readability)는 전달하는 내용을 쉽게 이해할 수 있느냐 하는 문제로 적 절한 단어의 선택, 자간, 행간의 조절들에 의해 좌우되고, 레저빌리티(legibility)는 개별적인 글자 형태를 쉽게 판독 할 수 있느냐의 문제로, 글자의 디자인, 크기, 조합 등에 의해 좌우된다. 이러한 요소는 광고, 편집 디자인 등 타이포그래피를 이용하는 시각 디자인 분야에서 독자의 시선을 원하는 정보에 머물도록 유도하는 데 활용된다.
라) 일관성
일관성이란 사이트 내에서 약속된 요소들의 규칙이라고 할 수 있다. 즉 그래픽 이나 텍스트, 레이아웃 등의 규칙에 따라 례이지가 이루어진다면 사용자는 쉽게 사이트에 익숙해질 것이고 보다 빠르고 쉽게 사이트룰 학습할 수 있게 된다. 예 를 들어 메뉴 버튼이 같은 모양과 같은 위치에 있다면 사용자는 쉽게 네비게이션 할 수 있다. 이처럼 일관성이 없는 웹 사이트는 사용자가 혼란에 빠지기 쉬워 길 을 잃게 된다.
일관성을 지켜야 할 몇 가지 요소들을 살펴보면 다음과 같다.
버튼 및 이미지 등의 그래픽적인 요소 - 버튼의 형태 및 위치
- 사진 및 관련 이미지 등의 화질 및 크기
그림 3 메타포를 사용한 대표적인 예 (윈도우의 아이콘)
텍스트 - 글꼴 형태
- 글꼴의 크기 및 칼라
- 한 페이지 내에 보여 지는 문단의 길이 칼라
- 레이아웃에 따른 그래픽적인 요소와 텍스트 등의 요소들의 칼라 조화 - 칼라의 종류의 수(칼라의 수가 많으면 일관성 유지가 어려움)
2. 수업
수업은 인간 대 인간의 상호작용을 통해 일어나는 사회적 경험이라는 전제 아 래, 면대면 수업은 수업의 전형적인 형태로 자리잡아왔다. 기존의 교육 패러다임 에 의하면, 정해진 시간과 공간 속에서 서로를 보고 듣고 느끼며 공동생활을 수 행함으로서 공동체 의식을 가질 수 있는 면대면 수업이야 말로 가장 이상적인 수 업형태로 간주되었다. 그러나 인터넷과 같은 새로운 기술의 등장으로 인해 학습 들은 '사이버스페이스' 라는 가상공간 속에서 교사와는 물론, 교실 밖의 다른 교 사, 학생, 전문가, 데이터베이스 및 다양한 프로그램들과도 얼마든지 상호작용을 할 수 있게 되었다.
2.1. 수업의 개념
게이지는 수업을 '어떤 사람들이 무엇을 할 수 있거나 행동할 수 있는 방도를 가르치기 위하여 제공되는 인간적인 영향' 이라고 정의한다. 이와 비슷한 맥락에 서 아미돈과 헌터는 수업을 '교실의 수업상황에서 교사와 학생들이 주고 받는 언 어의 상호작용 과정' 으로 정의하고 있다. 이들 정의의 공통점을 살펴보면 첫째, 수업에서는 인간인 교사와 학생이 수업의 주체가 된다는 점이다. 둘째, 수업은 인 간 대 인간의 상호작용 과정이라는 점이다. 셋째, 수업은 학습자의 행동을 변화시
키려는 의도적인 활동이라는 점이다. 이와 같이 학습은 교사가 주체가 되어 학습
키려는 의도적인 활동이라는 점이다. 이와 같이 학습은 교사가 주체가 되어 학습