This course is designed for beginners who wish to explore the fundamentals of Web Design and Graphic Design. It will provide an understanding of both disciplines, focusing on the core principles, tools, and skills necessary to create visually engaging, user-friendly websites and effective graphic designs.
Module 1: Introduction to Web Design
Basics of Web Design
What is web design?
Importance of user experience (UX) and user interface (UI).
Understanding Web Technologies
HTML, CSS, JavaScript overview.
Differences between web design and web development.
Tools for Web Design
Adobe XD, Figma, Sketch.
Online design tools (Canva, Webflow).
Module 2: HTML & CSS Fundamentals
Introduction to HTML
Basic structure of an HTML document.
Tags, elements, and attributes.
Creating headings, paragraphs, lists, links, and images.
Introduction to CSS
Styling elements: colors, fonts, spacing.
Working with classes and IDs.
Basic layout techniques: Flexbox and Grid.
Responsive Design
Media queries.
Designing for mobile, tablet, and desktop.
Module 3: Web Graphics and Visual Design
Introduction to Graphic Design Principles
Color theory and typography.
Layout and composition.
Branding basics for the web.
Working with Graphics Software
Adobe Photoshop: Image editing and optimization.
Adobe Illustrator: Creating logos and vector graphics.
Canva for quick graphic creation.
Optimizing Graphics for Web
File formats: JPEG, PNG, SVG, GIF.
Compression and loading speed.
Module 4: Advanced Web Design Techniques
Advanced CSS Techniques
Animations and transitions.
Pseudo-classes and pseudo-elements.
CSS variables and frameworks (Bootstrap, Tailwind CSS).
Introduction to JavaScript for Designers
Basics of interactivity: buttons, menus, forms.
Adding animations with libraries (e.g., GSAP, ScrollMagic).
Accessibility and Usability
Designing for all users.
Web Content Accessibility Guidelines (WCAG).
Module 5: Content Management Systems (CMS)
Introduction to CMS
Overview of WordPress, Joomla, and Drupal.
Setting up and customizing WordPress.
Using Themes and Plugins
Finding and installing themes.
Popular plugins for SEO, forms, and galleries.
Creating and Managing Content
Adding pages and posts.
Structuring a website for SEO.
Module 6: Web Design Project Management
Planning a Website
Gathering requirements.
Creating wireframes and prototypes.
Design Workflow
Collaborative tools: Trello, Slack.
Reviewing and revising designs.
Working with Clients
Presenting designs.
Handling feedback and revisions.
Module 7: Building a Portfolio Website
Designing Your Personal Portfolio
Showcasing skills and projects.
Creating an online presence.
Deploying Websites
Hosting and domain registration.
Publishing websites using GitHub Pages, Netlify, or traditional hosting.
Marketing Yourself
Leveraging social media and online platforms.
Networking in the web design industry.
Module 8: Capstone Project
Real-World Project
Students work on designing and developing a full website for a hypothetical or real client.
Includes branding, web design, and basic interactivity.
Presentation and Feedback
Peer reviews and instructor feedback.
Responses