Design Elective

Design Project 6 (Game Design & Development)

Annexure V.a

Course Description cum Session Plan 

Design Project 6 – Game Design and Development - DES3625

SEM – VI / 3rd YEAR


Course Instructor:

Ms. Shruti Bir
Office Number: 530
Phone: 7028015701
Email: shruti.bir@dypiu.ac.in
Office hours:   9:30 am -5:30pm
Location: SOD, DYPIU, Akurdi, Pune.

Teaching Assistant
Name: NA
Contact: NA
Office Hours: NA
Location: NA

Level (who can take this course?): 12th pass / Elementary and Intermediate course certificate holder and students who has a keen interest and passion for Games Design and also ready to advance their skills to the next level to become an industry ready professional.

Credit: 8 (75 hrs.)

Assessment and Evaluation:

Internal Evaluation - 80% (Continuous Evaluation)
Practical Assignments and Design Projects (60 marks)
Presentation(10 marks)
Viva/(10 marks)

 External Evaluation - 20%
Jury – 20 Marks

Maximum Number of Students: 44

Course Objectives:

  1. Understand the principles of visual scripting and how it applies to game development.
  2. Develop interactive game mechanics using Volt in Unity and Blueprints in Unreal Engine.
  3. Create high-quality UI/UX elements for game interfaces using Photoshop & Illustrator.
  4. Design 3D assets using Blender & Maya for integration into game projects.
  5. Implement visual effects, animations, and interactions without traditional coding.
  6. Optimize game logic and improve performance using efficient visual scripting techniques.
  7. Work in teams to develop a fully functional game prototype by the end of the module.
  8. Develop problem-solving skills related to debugging and enhancing gameplay interactions.

Prerequisites:

  1. Understanding user experience, interface design, and usability principles.
  2. Basic Game Design Concepts: Knowledge of game mechanics, player engagement, and level design.
  3. 2D & 3D Digital Art Basics: Familiarity with Photoshop, Illustrator, Blender, or Maya for asset creation.
  4. Basic Programming Logic: Understanding of logic flow, conditions, loops.
  5. Project-Based Learning & Collaboration: Ability to work in teams, brainstorm, and present game concepts.

Course Syllabus:

S. No.

Topic

Hours

1

Module 1: Fundamentals of 2D Game Design & Visual Scripting

10

2

Module 2: 2D Game Asset Creation & Integration

10

3

Module 3: 2D Game Mechanics & Interaction

10

4

Module 4: Developing a Complete 2D Game

10

5

Module 5: 3D Game Asset Creation & Environment Design

10

6

Module 6: 3D Character Rigging & Animation

20

7

Module 7: 3D Game Mechanics & AI Development

5

8

Module 8: Final 3D Game Development & Optimization

 

Total Hours

120


Lessons & Session Plan:

Modules

Phase 1: 2D Game Design & Development (Modules 1-4)

Date

Module 1

Fundamentals of 2D Game Design & Visual Scripting

  • Introduction to game design principles.
  • Volt (Unity's Visual Scripting): introduction to Unity
  • Overview of Unity and Volt for 2D game development.
  • Creating a basic interactive game prototype using visual scripting.
  • Understanding UI/UX elements in 2D games.

12/03/25 – 25/03/25

Module 2

2D Game Asset Creation & Integration

  • Using Photoshop & Illustrator for sprite creation.
  • Designing characters, environments, and UI elements.
  • Understanding tile-maps and sprite sheets.
  • Importing and integrating assets into Unity.

Assignment 1: 2D Game Asset Creation

Objective:

  1. Design and create 2D game assets using Photoshop & Illustrator.
  2. Develop characters, backgrounds, and UI elements.

Task:

  1. Design a 2D character sprite with at least three different poses (Idle, Run, Jump).
  2. Create a tile-based environment (e.g., grass, platforms, background elements).
  3. Design at least three UI elements (buttons, icons, health bar).
  4. Submit a sprite sheet with assets properly arranged for game integration.

Submission Format:

  • PNG files of individual assets.

Documentation (PDF): explaining the design process

26/03/25 -28/03/25

 

Module 3

2D Game Mechanics & Interaction

  •  Implementing character movement, physics, and collision.
  • Creating enemy AI and basic behaviours using Volt.
  • Adding player interaction (jump, attack, pickups).
  • Introduction to game loops and state management.

Assignment 2: Build a Simple 2D Game Prototype

 Objective:

  1. Learning tools: Photoshop, Illustrator, Unity, Volt (Unity's Visual Scripting)
  2. Use Unity & Volt to develop a basic playable 2D game.
  3. Implement game physics, movement, and interaction.

Task:

  1. Develop a side-scrolling or top-down 2D game (e.g., platformer, shooter, or puzzle).
  2. Implement player movement (walk, jump, attack) using Volt.
  3. Add collision detection and basic enemy AI.
  4. Create a main menu and game over screen.
  5. Playtest and fix common issues.

Submission Format:

  • Unity project files.
  • A short video demonstration (2-3 minutes).

Documentation (PDF): explaining game mechanics and scripts.

31/03/25 – 02/04/25

 

Module 4

Developing a Complete 2D Game

  • Structuring a full game project in Unity.
  • Implementing UI menus, animations, and sound effects.
  • Playtesting and debugging common issues.
  • Finalizing and optimizing the game for deployment.

03/04/25 – 07/04/25

 

Phase 2: 3D Game Design & Development (Modules 5-8)

 

 

Module 5

3D Game Asset Creation & Environment Design

  • Introduction to Blender & Maya for 3D modelling.
  • Designing game-ready characters, props, and environments.
  • Applying materials, textures, and lighting.
  • Exporting models and integrating them into Unreal Engine.

08/04/25 – 09/04/25

Module 6

3D Character Rigging & Animation

  • Basics of character rigging and skinning.
  • Creating walk, run, and attack animations.
  • Using Blueprints to trigger animations in Unreal Engine.
  • Implementing character movement and interaction.

Assignment 3: 3D Character & Environment Modelling

Objective:

  • Learning 3D tools Blender/Maya, Unreal Engine, Blueprints (Unreal Engine's Visual Scripting)
  • Create and texture 3D characters and environments for a game.

Task:

  1. Design and model a simple 3D character in Blender or Maya.
  2. Rig the character and create basic animations (Idle, Walk, Attack).
  3. Model a small 3D environment with props.
  4. Apply textures and lighting to enhance realism.
  5. Import the assets into Unreal Engine for testing.

Submission Format:

  • .FBX files of models.
  • Screenshots of the environment and character.

Game documentation: A PDF report detailing the modelling process.

11/04/25 – 15/04/25

Module 7

3D Game Mechanics & AI Development

  • Implementing gameplay interactions, combat, and AI behaviours.
  • Designing enemy movement, patrol, and attack patterns.
  • Creating a health system, power-ups, and combat mechanics.
  • Using Blueprints for advanced AI-driven interactions.

Assignment 4: Interactive 3D Game Prototype

Objective:

  • Develop an interactive 3D gameplay experience using Unreal Engine & Blueprints.

Task:

  1. Implement a third-person or first-person game prototype.
  2. Use Blueprints to create basic enemy AI (e.g., patrol, chase, attack).
  3. Develop an objective-based mechanic (e.g., collect items, defeat enemies).
  4. Implement a health system and UI elements.
  5. Optimize and test the game.

Submission Format:

  • Unreal Engine project files.
  • A short gameplay video (2-3 minutes).

Game documentation: (PDF) explaining Blueprints used.

16/04/25 – 17/04/25

Module 8

Final 3D Game Development & Optimization

  • Structuring a complete 3D game project.
  • Optimizing game performance and UI elements.
  • Playtesting, debugging, and balancing the gameplay.
  • Final game presentation and feedback session.

Assignment 5: Final Presentation (2D & 3D Game Showcase)

Objective:

  • Present and showcase the 2D and 3D games developed.
  • Explain design choices, challenges, and solutions.

Task:

  1. Create a presentation (PowerPoint or PDF) showcasing:
  2. The 2D game project (concept, assets, gameplay)
  3. The 3D game project (environment, character, mechanics)
  4. Challenges faced and solutions implemented.
  5. Prepare a 5–7-minutes demonstration of the games.
  6. Submit a recorded video of the gameplay.

Submission Format:

  • Presentation slides (PPT/PDF).
  • Video demonstration (5-7 minutes).

21/04/25 – 23/04/25

 

Course Outcome:

  1. Demonstrate proficiency in visual scripting using Volt & Blueprints.
  2. Design and implement game UI/UX with industry-standard tools.
  3. Create and integrate 2D & 3D assets into a game engine.
  4. Develop interactive prototypes that showcase engaging game mechanics.
  5. Optimize gameplay logic and performance without writing code.
  6. Collaborate effectively in a game development pipeline.
  7. Present and document a fully functional game prototype as a portfolio project.
  8. Analyse and apply game design principles to create immersive user experiences.

Text book:

Reference book: Books Recommended 

A Theory of Fun
The Art of Game Design: A Book of Lenses
Rules of Play: Game Design Fundamentals
The Ultimate Guide to Video Game Writing and Design
The Gamification of Learning and Instruction: Game-based Methods and Strategies for Training and Education
Level Up! The Guide to Great Video Game Design
Holistic Game Development with Unity: An All-in-One Guide to Implementing Game Mechanics, Art, Design and Programming

Web References : Research Papers/Articles recommended for reading:

https://docs.unity3d.com/Manual/index.html

Study Materials:

Pdfs, Docs, Exl sheets, PPTs and also supportive internal tutorial Videos will be provided as required alongside the day-to-day lectures to make the learning and teaching more interactive, easy and fun.


Design Project 5 (Motion Design for UI)

Course Description cum Session Plan 
Design Project 5 Motion Design for UI - DES3624

SEM – VI / 3rd YEAR


Course Instructor:

Ms. Shruti Bir
Office Number: 530
Phone: 7028015701
Email: shruti.bir@dypiu.ac.in
Office hours:   9:30 am -5:30pm
Location: SOD, DYPIU, Akurdi, Pune.

Teaching Assistant

Name: NA
Contact: NA
Office Hours: NA
Location: NA 

Level (who can take this course?): 12th pass / Elementary and Intermediate course certificate holder and students who has a keen interest and passion for design and VFX and has basic idea of how digital design work.

Credit: 5 (75 hrs.)

Assessment and Evaluation:
Internal Evaluation - 80% (Continuous Evaluation)

  • Practical Assignments and Design Projects (60 marks)
  • Presentation/Viva (20 marks) 

External Evaluation - 20%
Jury – 20 Marks

Maximum Number of Students: 43

Course Objectives:

1.      Learn the application of animation and motion graphics in UI design
2.      Learn how to prototype motion graphics animations using software like Adobe After Effects and other prototyping software as well as with code
3.      Learn to deliver specifications for UI animations to software developers

Prerequisites:

  1. Knowledge of UI design
  2. Knowledge of prototyping tools
  3. Familiarity with basic concepts of animation
  4. An introduction to industry standard digital tools: Adobe Animate, After effect/Premier and 3D tools such as Blender/Maya and Media Encoder.  

Course Syllabus:

S. No.

Topic

Hours

1

Module 1: Introduction to Motion Design in UI

5

2

Module 2: Introduction to Motion Design tools

5

3

  Module 3 : Function of Motion Graphics in App/Website

5

4

  Module 4: Motion Design for Advance UI Elements

10

5

  Module 5: Usability and Functional Role of Animation in UI

10

6

  Module 6: Conceptualizing, Storyboarding, and Prototyping for Motion Video

20

7

  Module 7: Polishing, Optimization and Successful delivery of the M Video

5

                                                                                                                                              Total Hours

60


Lessons & Session Plan:

S. no.

Content

Date

1

Module 1: Introduction to Motion Design in UI

·        What is Motion Design or Motion Graphics Design in UI.

·        Key Elements of Motion Design: Animation, Typography, Visual Graphics, Videos, Images, Shapes & Forms, Illustrations & Icons, Sounds & music, Compositions & Layout, Colors & Textures, Transitions, Timing & Speed,  Depth & Space, Staging & Lighting. Visual Effects (VFX), Storytelling.

·        Importance of Motion design: Learn the Importance of Motion design in UI/UX using online references, case studies and examples etc.

·        Role of Motion Design in UI/UX: Explore the role of motion design in enhancing user interfaces (UI), including providing visual feedback, guiding user interactions, and conveying hierarchy and structure.

2nd Jan - 6th Jan

2

Module 2: Introduction to Motion Design tools

Primary Adobe Motion Design Tools

1.      Adobe After Effects – Industry-standard motion graphics and visual effects software used for animations, compositing, and special effects.

2.      Adobe Premiere Pro – Professional video editing software that supports motion graphics, transitions, and video effects.

3.      Adobe Animate – 2D animation software for web, game, and video projects, formerly known as Flash.

Supporting Tools for Motion Design

5.      Adobe Photoshop

6.      Adobe Media Encoder – Assists in rendering and exporting motion graphics and animations in various formats. And support advance level optimisation.

7.      Blender/Maya

 

13th Jan – 18th Jan

3

Module 3: Function of Motion Graphics in App/Website

·        Function of Motion Graphics Design: Understand the function of Motion Graphics Design and the purpose of it: State Change Animations, Reveal Interactions/Animations, Emphasis Animations etc.

·        Exploring advance UI as motion videos : Animated web banner/ product launch/promotional videos etc.

·        Assignment 1- Animated web banner/Product Launch Motion Video (Advance form of UI)

1.      Concept Development: Based upon previous research and learning, develop the concept for creating an Animated web/app banner or Product launch Video using Adobe Animate and Adobe Premier. 

2.      Create Storyboard

3.      Create the animated video: Implement all your learnings, skills, technical knowledge to finally execute the concept developed in storyboard and submit the Animated Web/App banner/ Animated Product Launch Video before the deadline.

19th Jan – 24th Jan

4

Module 4: Motion Design for Advance UI Elements

1.      Advance UI elements: learning about the advance UI elements and understanding the need for more complex and advance form of Motion Design for advance UI elements. Examples: 2D/3D Product Launch Videos/Product Promotional Videos/Explainer Videos/Brond Story/Intro Videos

2.     Advance techniques & tools: Introduction of After Effects and its features, Introduction of 3D Objects/Models/Character animation for motion Design

3.     Code-based motions for interactive experiences

4.      Online Research: Through advance techniques and tools, understand the specific needs of a brand and create brand stories, implement new services, enhance the existing product/services or simple celebrate an achievement or simply generate more traffics to maintaining brand reputation and its consistency.

 

25th Jan – 30th Jan

5

Module 5 : Usability and Functional Role of Animation in UI

·        Adobe Animate/Adobe Premier: Introduction to animation tool and its advance features.

·        Motion Design Principles: Animation in basic UI elements: Easing (Slow In, Slow Out), Offset & Delay, Parenting, Transformation, Value Change, Masking, Overlay, Cloning, Obscuration, Parallax, Dimensionality, Dolly & zoom.

·        Introducing 2D characters and motion: 2D character rigging and animations.

·        Introduction of video as advance UI elements: transitions and VFX, understand how Videos and animation contributes to the usability of interfaces by providing clear feedback, improving orientation, and reducing cognitive load.

31st Jan - 31st Jan

6

Module 6: Conceptualization, Storyboarding, Prototyping of Motion Video

·        Master the process of storyboarding and conceptualization to plan and visualize UI animations and transitions in order to create and advance UI element.

·        Prototype animations, vfx using tools like Adobe animate, After Effects, Adobe Premier or even 3D tools like Blender/Maya to achieve the advance level and for detailed motion design.

·        Assignment 2 - Conceptualization, Storyboarding and Report writing

1.      Concep Development: Based upon previous research and learning, develop the concept for creating an Animated web/app banner or Product launch Video using Adobe Animate and Adobe Premier. 

2.      Report writing and Create Storyboard

3.      Create the Prototype of Animated/Motion Video: Implement all your learnings, skills, technical knowledge to finally execute the concept developed and submit the Animated Web/App banner/ Animated Product Launch Video before the deadline.

4.      Presentation: Present your project to UI/UX and other design experts and faculties.

5th Feb – 26th Feb

 

27th and 28th Feb – Presentation

 

7

Module 7: Polishing, Optimization and Successful delivery of the M Video

·        Iteration - taking feedback and polishing every element of the      

·        Animation/Motion Video

·        Polishing the Video to match the Industry Standard

·        Optimization of the media. Introduction to Optimization tools  

·       Preparing the motion video to embedded into the App/Web, Introduction to Adobe Media Encoder and other optimization tools as/if required.  

3rd March -5th March

 

Course Outcome:

  1. Demonstrate a strong understanding of motion design principles and their application in UI/UX.
  2. Develop advanced motion graphics using industry-standard tools and techniques.
  3. Create purpose-driven and aesthetically compelling animations for a variety of UI elements.
  4. Optimize motion assets for seamless integration across digital platforms.
  5. Build a professional motion design portfolio showcasing their expertise.

Text Book: N/A

Text book:

  • Designing Interface Animation: Improving the User Experience Through Animation - Author: Val Head
  • Design for Motion: Fundamentals and Techniques of Motion Design - Author: Austin Shaw

Reference Book:

1.      Designing Interface Animation: Improving the User Experience through Animation by Val Head
2.      Motion Design Toolkit by Austin Shaw
3.      The Animator's Survival Kit by Richard Williams
4.      UI Animation Essentials for Non-Designers by Pablo Stanley
5.      Creative Motion Graphic Titling for Film, Video, and the Web by Yael Braha and Bill Byrne

Study Materials: 

Pdfs, Docs, Exl sheets, PPTs and also supportive internal tutorial Videos will be provided as required alongside the day-to-day lectures to make the learning and teaching more interactive, easy and fun.


Web references for external research and study:

  • Compelling and Moving: A Guide to Motion Design Principles
  • Making Motion Meaningful

  1. Adobe Animate Tutorials
    https://helpx.adobe.com/animate/tutorials.html

  2. Adobe After Effects Help Centre
    https://helpx.adobe.com/after-effects

  3. Premiere Pro Tutorials
    https://helpx.adobe.com/premiere-pro/tutorials.html


Design Project 4 (UX Writing & Microcopy)

Design Project 4 (Introduction to Programming)

Course Description cum Session Plan 

Design Project 4 - Introduction to Programming - DES3622

SEM – VI / 3rd YEAR


Course Instructor:
Ms. Shruti Bir
Office Number: 530
Phone: 7028015701
Email: shruti.bir@dypiu.ac.in
Office hours:   9:30 am -5:30pm
Location: SOD, DYPIU, Akurdi, Pune.

 

Teaching Assistant
Name: NA
Contact: NA
Office Hours: NA
Location: NA
 

Level (who can take this course?): 12th pass / Elementary and Intermediate course certificate holder and students who has a keen interest and passion for design and coding and has basic idea of how digital design work.

Credit: 4 (60 hrs.)

Assessment and Evaluation:
Internal Evaluation - 80% (Continuous Evaluation)
  • Practical Assignments and Design Projects (40 marks)
  • MCQ/Technical assessment (20 marks)
  • Presentation(10 marks)
  • Viva/(10 marks)
External Evaluation - 20%
Jury – 20 Marks

Maximum Number of Students: 44
Course Objectives: 
  1. Develop basic web pages using HTML, CSS, and JavaScript.
  2. Apply responsive web design techniques to create mobile-friendly websites.
  3. Utilize Bootstrap to enhance web page responsiveness and aesthetics.
  4. Write basic JavaScript programs to manipulate web elements and handle user interactions.
  5. Implement advanced web features such as interactive galleries, modals, and forms.
  6. Gain exposure to modern web development trends and tools used in the industry.
  7. Build a fully functional mini-project website that demonstrates key programming skills.

Prerequisites:
1.      Knowledge with HTML/CSS
2.      Basic computer literacy (using files, folders, web browsers, etc.).
3.      Familiarity with using the internet and web applications.
4.      A keen interest in learning how websites and applications are built.
5.      No prior programming knowledge is required, but a logical mindset and problem-solving skills will be beneficial.

Course Syllabus:

S. No.

Topic

Hours

1

Module 1: Introduction to Programming

10

2

Module 2: Responsive Web Programming

10

3

Module 3: Introduction to Bootstrap

10

4

Module 4: Introduction to JavaScript

10

5

Module 5: Advanced Programming for Web and App Features

20

                                                                                                                                              Total Hours

60


Lessons & Session Plan:

Sr. No.

Module Topics

Duration/ Dates

1

Module 1: Introduction to Programming

  • What is programming?
  • Importance of programming in the digital era
  • Types of programming languages (Compiled vs. Interpreted, Procedural vs. Object-Oriented, etc.)
  • The significance of programming in career development
  • Introduction to Internet and Intranet – Definition, Differences, and Applications
  • Understand the web:
  • Classification of programming as Frontend and Backend Development: Industry-preferred for web and app development and also trends and efficiency in programming.

Feb 10 – Feb 11, 2025

2

Module 2: Responsive Web Programming

  • Introduction to Responsive Web Programming
  • Why is responsive design crucial in modern web development?
  • Common scripting languages used for creating responsive websites
  • HTML: Structure of a webpage, essential tags, forms, tables, hyperlinks
  • CSS: Styling, layout techniques (flexbox, grid), media queries for responsiveness
  • JavaScript: Basics of interactivity, DOM manipulation
  • jQuery:

Assignment 1: Develop a basic 5-page website layout incorporating all fundamental website elements such as navigation, content sections, images, and forms etc.

Feb 21 – Feb 25, 2025

3

Module 3: Introduction to Bootstrap

  • What is Bootstrap and why is it widely used?
  • Installing and setting up Bootstrap
  • Bootstrap Grid System and Layouts
  • Using Bootstrap components (Navbar, Buttons, Forms, Cards, etc.)
  • Enhancing responsiveness with Bootstrap utilities and flexbox

Assignment 2: Hands-on project: Implement Bootstrap features into the existing 5-page website to create the responsiveness.

Feb 27 –28Feb & March 03, 2025

4

Module 4: Introduction to JavaScript

  • Understanding JavaScript and its role in web development
  • JavaScript Variables, Data Types, and Operators
  • Control Flow: Conditional Statements (if-else, switch)
  • Loops (for, while, do-while)
  • Functions and Event Handling
  • DOM Manipulation and Document Object Model
  • Working with Arrays and Objects

Assignment 3: Adding interactivity to the existing website (interactive buttons, simple animations, basic form validation)

4 - 5 March and 12 -13 March, 2025

5

Module 5: Advanced Programming for Web and App Features

  • Advanced JavaScript Concepts
  • Introduction to jQuery and how it simplifies JavaScript
  • Creating interactive UI components (sliders, accordions, modals)
  • Implementing responsive image galleries
  • Enhancing web forms (validations, interactive input fields)
  • Introduction to APIs: Fetching and displaying data dynamically

Assignment 4: Adding advanced features to the website (forms, modals, animations, API integration)

17 - 21 March


Course Outcome:

1.      Enhances Academic Reputation: The course provides a strong foundational programming curriculum, improving the university’s academic standards.
2.      Industry-Relevant Curriculum: Aligns with industry demands, making the university's graduates more employable.
3.      Promotes Interdisciplinary Learning: Encourages collaboration between departments such as computer science, design, and business.
4.      Supports Research & Innovation: Encourages students to explore emerging technologies, contributing to university-led research projects.
5.      Attracts More Enrolments: By offering a well-structured programming course, the university can appeal to a broader range of students, including those interested in UI/UX, software development, and web design.
6.      Develops Fundamental Programming Skills: Provides a strong foundation in programming concepts, essential for web and software development.
7.      Enhances Problem-Solving Abilities: Encourages logical thinking and algorithmic problem-solving skills.
8.      Prepares for Industry Roles: Equips students with the skills required for entry-level roles in web development, UI/UX design, and software engineering.
9.      Encourages Hands-On Learning: Through practical projects, students gain real-world experience in creating websites and interactive applications.
10.   Opens Pathways for Advanced Learning: Serves as a stepping stone for further studies in full-stack development, mobile app development, and data science.

Text book:
Head First Programming - Authored by Paul Barry and David Griffiths.

Reference Book:
Learning Processing: A Beginner's Guide to Programming Images, Animation, and Interaction

Study Materials: 
Pdfs, Docs, Exl sheets, PPTs and also supportive internal tutorial Videos will be provided as required alongside the day-to-day lectures to make the learning and teaching more interactive, easy and fun.

Web references for external research and study:
Research Papers/Articles recommended for reading:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction
W3school - https://www.w3schools.com/

 

 


Design Project 4 - Agile for Designers