Information Package
baskent.edu.tr

Program of Visual Communication Design

GİT326

INTERNET AND INTERFACE DESIGN I

Course Code
GİT326
Semester
Sixth Term (Spring)
Theory+Practice
2 + 2
ECTS
6
Course TypeCompulsory Course
Course LevelBachelor's Degree
Year of Study3
SemesterSixth Term (Spring)
ECTS6
Name of Lecturer(s)
Learning Outcomes

At the end of this course, the students;

  1. Defines basic web technologies.
  2. Demonstrates skill for creating HTML pages.
  3. Can define what the interface is and which criteria are important in interface design.
  4. Comprehends the process of creating a conceptual model for a website.
  5. Carries its current knowledge on page layout, color usage and typography to the web.
  6. Plan and execute the creation process of a web page.
  7. Can create interactive designs.
  8. Demonstrates skills to implement web standards-based websites.
  9. Designs adaptive, accessible and optimized websites.
Mode of DeliveryFace to face
PrerequisitesNo
Recommended Optional Programme Components
Course DescriptionThis course; The concept of user interface design includes creative, innovative, artistic interface designs for different devices and applications such as computers, mobile phones, components of interface design, interaction, usability, readability, accessibility. The aim of the course is to enable students to create a design by applying the principles of human-computer interaction to useful, productive and effective user interfaces, and to provide basic information in order to create high-quality, interactive, content-rich web publications in accordance with current design methods.
Course Contents
WEEK TOPICS
1st Week Internet history, Basic Protocols, File Formats, Basic Concepts.
2nd Week Introduction to HTML Codes, Introduction to HTML Code Applications.
3rd Week To give text type, size and color with HTML Head Commands, HTML Body Commands, HTML Body Codes, editing texts and images with HTML Body Codes.
4th Week Creating tables with HTML Body Codes. HTML Form Elements, creating and submitting forms with HTML codes, adding asp or php codes.
5th Week Types of CSS on the website: typography, consistency, color settings, original Project, implementation.
6th Week Introduction to Dreamweaver HTML editor, Adobe Dreamweaver CS6 program interface introduction.
7th Week Midterm.
8th Week Using HTML and CSS properties in Properties Panel, creating in-document link, adding image, linking to different places in the image.
9th Week Preparing templates for web in Adobe Photoshop program.
10th Week Creating Tables in Dreamweaver: Giving content to rows and columns, Linking cells, Designing Table menu cells as buttons. Creating forms in Dreamweaver, adding form elements, spry codes.
11th Week Adding flash video in Dreamweaver, calling video from different video sharing sites by opening a page within a page with Iframe code.
12th Week CSS applications and div codes. Lightbox application: organizing portfolio works.
13th Week Placing ready-made Java script and CSS codes in the head commands area.
14th Week Final Project Application.
Recommended or Required ReadingSam Quayle, 2010, An Introduction to HTML Prototyping
Jennifer Tidwell, A Pattern Language for HCI Design, http://www.mit.edu/~jtidwell/
Handcraft - Online prototyping tool. Alternative to Codeanywhere
TextMate - Recommended code editor for Mac OS X
E - TextEditor - Recommended code editor for Windows
When can I use? - A good resource for checking browser compatibility of HTML and CSS features
Code Academy - Online course for learning programming basics with JavaScript
Grover, C. ; Flash CS6: The Missing Manual, O?Reilly Media, 2012
Gümüştepe, Y.; Dreamweaver CS6; Kodlab Yayın Dağıtım, 2013
Planned Learning Activities and Teaching Methods
  • Lecture
  • Discussion
  • Practice
  • Project
  • Presentation
Assessment Methods and Criteria
Quantity Percentage (%)
Mid-term 1 20
Practice 1 20
Project 1 40
Total(%) 80
Contribution of In-term Studies to Overall Grade(%) 80
Contribution of Final Examination to Overall Grade(%) 20
Total(%) 100
ECTS Allocated Based on Student Workload
Activities Quantity Duration (Hour) Total Workload (Hour)
Midterm exam 1 1 1
Preparation for Quiz
Individual or group work 14 2 28
Preparation for Final exam 1 5 5
Course hours 14 6 84
Preparation for Midterm exam 1 5 5
Laboratory (including preparation) 14 3 42
Final exam 1 1 1
Homework 1 4 4
Project 1 10 10
Total Work Load180
Total Work Load / 30 (h)6
ECTS Credit of the Course6
Language of InstructionTurkish
Work Placement(s)No

Programme Qualifications / Learning Outcomes

LO1 LO2 LO3 LO4 LO5 LO6 LO7 LO8 LO9
K1 X
K2 X
K3 X
K4 X
K5 X
K6 X X
K7 X
K8 X X X X
K9 X X
K10 X X
K11 X X
K12 X
K13 X X
K14 X
K15 X
K16 X
K17 X
K18 X
K19 X