defter*
defter / katalog / GRA 316
GRA 316

Interface Design Studio

The course aims for a multi-layered understanding of what an interface means by bridging the gap between its' physical and virtual properties. Sign theory is central to the course; it is introduced as a framework to implement functional web interfaces.

Credit3
ECTS5
BölümGraphic Design
FacultyFaculty of Art, Design, and Architecture
PrereqGRA 218
MüfredatY3 Bahar

Hocalar 2 bu dönem · 0 geçmiş

Bu dönem (2025-2026 Spring) · 2 section
Can İzzet Birand, Erhan Tunalı

→ STARS müfredatı / syllabus

Materyal — 0 dosya

Bu derste henüz materyal yok.

İlk dosyayı sen ekleyebilirsin — notlar, geçmiş finaller, çözümler, cheat-sheet, ne varsa. Drive linki / PDF / ZIP / fotoğraf, hepsi olur.

Şu an: mail at, ben düzenleyip yayına alayım. Form/upload UX yakında geliyor (Kimya tasarlıyor).

↑ konuya GRA 316 yaz

Geçmiş GPA dağılımı 9 dönem · ort. 2.87

DönemCourse CPA
2024-2025 Spring 2.88 2 sec · 49 öğr
2023-2024 Spring 2.89 1 sec · 16 öğr
2022-2023 Spring 2.34 2 sec · 34 öğr
2021-2022 Spring 2.58 2 sec · 34 öğr
2020-2021 Spring 2.90 2 sec · 29 öğr
2019-2020 Spring 2.97 2 sec · 24 öğr
2018-2019 Fall 2.93 1 sec · 10 öğr
2018-2019 Spring 2.95 1 sec · 23 öğr
2017-2018 Fall 3.41 1 sec · 17 öğr

Aggregate course GPA — Bilkent STARS'tan public data. Hoca-bazlı per-section detayı için STARS evaluation report →. Öğrenci anket cevapları KVKK kapsamında defter'de tutulmaz.

Müfredat detayı STARS syllabus

📚 Önerilen kaynaklar

  • Zorunlu PDF Packet
  • Önerilen HTML & CSS Design and Build Websites John Duckett

⚖️ Değerlendirme

  • 10% — Project: Assignment 1 (×1)
  • 15% — Project: Assignment 2 (×1)
  • 20% — Project: Assignment 3 (×1)
  • 20% — Project: Assignment 4 (×1)
  • 30% — Term project: Final Submission (×1)
  • 5% — Performance: Process, studio work, attendance (×1)

⚠️ FZ engelleyen şartlar

Attending at least %80 of the classes is required. That it 9 allowed hours of abscence. Life happens, so do not be frivolous with your 9 alloted abscence hours, you may need them later on. No differentiation is made between excused and unexcused abscences. Failing to meet the attendance criteria will result in final presentation disqualification. I also expect at least %50 performance for the assignments throughout the

🤖 GenAI politikası

For Research: Allowed, step-by-step documentation is required. For visual idea generation: Allowed, step-by-step documentation is required. Design process: Allowed, step-by-step documentation is required. Final product: Direct output from prompt to image is not allowed.

📅 Haftalık müfredat

Course Introduction Introduction: Interactive lecture on Sign Theory. Indexical, iconic, and symbolic signs. De-mystifying user interface terminology using Material Design. Project introduction. Reading: The Interface Experience - A User’s Guide UI Component: Surface & Hero Image. Concepts of background and foreground as material surfaces. Opaque / semi-opaque surfaces. Browser window as a -dynamic- surface; fullwidth surfaces vs. fixed-width surfaces. The concept of a “button” including full functionality from the analog button. Reading: Material Design; intro, environment, material properties, elevation, and shadows. Intro to HTML. UI Component: Card lecture and tutorial. Cards as basic and flexible layout elements. Intro to CSS. Reading: Material Design, Components - Cards. UI Component: Card lecture and tutorial. Cards as basic and flexible layout elements. Intro to CSS. Reading: Material Design, Components - Cards. Integrating cards into wireframes & grid systems. Lessons from swiss style graphic design & modern examples in the light of swiss style. Work-in-progress: card study assignment. UI Component: Flexbox Process Check. Reading: By-Design, Alice Rawsthorn UI Component: Hero & Media Queries Further Header (or “Hero”) development The idea of different sections serving different “goals and elements” purposes. Lecture and tutorial about how headers draw in a user, provide context about the content and reinforce the brand identity. Reading: Material Design, imagery & color. UI Component: Tables and Navbar Improvements in readablity and aesthetics in a schedule design. Tables as data structures. Reading: Material Design, Data Styles. UI Component: Mark(s) & Modal Box Design. In this course, we use the term mark as a generic name for various logos, symbols and icons that enhances user experience and reinforces brand identity. Modal (or dialog) windows provide extra content and UI controls. They retain focus until dismissed. Tutorial on Pure CSS Modal windows. Reading: Material Design, Icons. UI Component: Location. Creating a map that fits the visual unity and consistency of a web page using various mapmaking tools. Process Check. Term Project Checklist: A comprehensive overview of attention points that are covered earlier, including typography, divs, spacings, margins, paddings, image quality and other technicalities. Getting ready for the Final Presentation. Term project work in progress. Term project work in progress. ECTS - Workload Table: Activities Number Hours Workload Laboratory (including preparation) 14 2 28 Homework 5 5 25 Presentation (including preparation) 1 10 10 Course hours 14 1 14 Individual or group work 14 3 42 Project (including preparation and presentation if applicable) 1 25 25 Total Workload: 144 Total Workload / 30: 144 / 30 4.8 ECTS Credits of the Course: 5 Type of Course: Studio - Lecture - Project - Tutorial Course Material: Multimedia - Written Teaching Methods: Assignment - Case studies - Lecture - Practical sess