Skip to main content
Cyprus International University
TR

INTERACTIVE DESIGN

Course
GRDE303 - INTERACTIVE DESIGN
Department
Graphic Design - English - Undergraduate
Course Type
Course
Status
Required
Language
English
Credit
3
ECTS
4
T+P+L
2 + 2 + 0
Course Coordinator(s)
Prof. Dr. Vüsal BAĞIROV
Prerequisite
-
Keywords

Course Description

Interactive Design blends theoretical and practical perspectives in the areas of visualization and interactivity into several focused projects using interactivity for education, entertainment, and industrial purposes. The hands-on and guided practice centers on software and other design interfaces with which the system defines and/or responds to the users’ behavior. However the purpose of this course is to introduce interactive design techniques to enable the student to use their design and software knowledge as a basis specifically learning how to design an online interaction design like an interactive magazine, book, website, and application is the main area of progress and objective.

INTERACTIVE DESIGN

Evaluation Tools (Active Term)

Item Type Weight (%)
Midterm Project Midterm 30
Final Project Final 40
Project 1 Project 15
Project 2 Project 15
Total 100

Course outcomes

  1. 01 Designs concepts (3) and studies them (5)
  2. 02 Designing original logo designs (5) and visualizing ideas with Indesign and Photoshop (5)
  3. 03 Decides (2) which color graphic elements can be used and designed (5)
  4. 04 Define the Concept (2) and describe the relationship between text and visual elements. (3)
  5. 05 Designing (5) and developing (4) student's artistic perspectives

Course Syllabus

Week Topic
Week 1 Introduction, general description of interactive design
Week 2 Introduction to Interactive Graphic Design: What is interactive design? Historical context and evolution. Principles: usability, engagement, and interactivity. Case studies (websites, apps, installations).
Week 3 Fundamentals of User-Centered Design: UX vs. UI explained. Understanding target audiences & personas. Wireframing basics.
Week 4 Visual Design Principles in Interactivity: Typography, color, and layout for screens. Accessibility & inclusivity in design. Responsive/adaptive design principles. Exercise: Reworking a static poster into an interactive layout.
Week 5 Tools for Interactive Graphic Design: Software: Figma, Adobe XD, After Effects, Blender (for motion). Introduction to prototyping tools. Workshop: Building clickable prototypes.
Week 6 Motion & Time-Based Design: ole of motion in interactivity. Micro-interactions & animations. Exercise: Creating animated buttons or transitions.
Week 7 Interactive Media & Storytelling: Narrative design in interactive experiences. Storyboarding interactive flows. Workshop: Designing an interactive infographic.
Week 8 MIDTERM
Week 9 MIDTERM
Week 10 Web & Mobile Interfaces: Designing for different devices. Mobile-first vs. desktop-first strategies.
Week 11 Web & Mobile Interfaces: Usability testing methods. Workshop: Redesign an app screen with improved UX.
Week 12 Experimental & Emerging Technologies: AR/VR in interactive design. AI-driven interactivity. Interactive installations & multimedia. Discussion: Future of interactive graphic design.
Week 13 Project Development I: Project proposal & wireframes.
Week 14 Project Development II: Prototyping, design testing, and refinement.
Week 15 FINAL

Reference Books & Course Materials

  1. 01 Adobe After Effects 2020, Adobe After Effects CC Basics and Advanced motion graphics by Meyers, 2020
  2. 02 Designing in Figma, Federenko, 2020
  3. 03 Motion Graphic, Principles and Practices by Crook & Beare, Bloomsbury, 2016
  4. 04 Figma for UI/UX, Aditi Sharma, Orange Education, 2025

Learning Outcomes

  1. L01 Expresses(2) an idea, concept or phenomenon visually in a creative way SOLO 2
  2. L02 Students will be able to decide(2) and analyze(4) which color graphic elements can be used SOLO 3
  3. L03 Applies(3) technology effectively in the design process SOLO 3
  4. L04 Symbolizes(3) concepts, situations, and objects in the visual context SOLO 3
  5. L05 Students will be able to use(3) and produces(5) different visual areas such as multimedia, advertising graphics, animation, new media, printmaking, and photography SOLO 4

Program Outcomes

  1. P01 The student chooses the design principles and can match the application
  2. P02 Students will be able to define national and international values in art and design
  3. P03 Students will be able to define abstract and concrete design concepts and express them in composition
  4. P04 The student can adjust the time correctly to complete his / her graphic application
  5. P05 The student matches the relationship between image and meaning
  6. P06 Students can express what they see by drawing
  7. P07 Identifies the traces, aligns, and calculates the hierarchy of typographic elements
  8. P08 Defines and lists art and design materials
  9. P09 Expresses an idea, concept or phenomenon visually in a creative way
  10. P10 Solves the design problems encountered in the process
  11. P11 Symbolizes concepts, situations, and objects in the visual context
  12. P12 Develops design projects by recalling basic graphic design principles
  13. P13 Applies technology effectively in the design process
  14. P14 Can think critically and question theoretical gains in the context
  15. P15 Relate the past, present, and future of design
  16. P16 Can perform original works related to the field and evaluate the results
  17. P17 Designs and produces different visual areas such as multimedia, advertising graphics, animation, new media, printmaking, and photography
  18. P18 Improves communication skills for teamwork
  19. P19 Can effectively discuss, criticize and form theory about the field
  20. P20 Student can organize paragraphs, single-column, multi-column and modular grids in book and magazine designs
  21. P21 Can plan collaborations with colleagues in interdisciplinary and multidisciplinary environments
  22. P22 Can associate written texts with visual images
  23. P23 Can observe and compare in the context of art criticism methods
  24. P24 Can apply legal regulations and procedures in the field
  25. P25 Be able to associate written texts with visual images

Po-Lo Matrix

LO P01 P02 P03 P04 P05 P06 P07 P08 P09 P10 P11 P12 P13 P14 P15 P16 P17 P18 P19 P20 P21 P22 P23 P24 P25 Average
L01 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
L02 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
L03 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
L04 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
L05 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0