Hafta 114–20 Eyl
Syllabus, araçlar ve arayüz deneyimi okuması
Introduction to the syllabus and the required tools. Reading: The Interface Experience - A User’s Guide
syllabusaraçlarThe Interface Experience
Hafta 221–27 Eyl
HTML/CSS temelleri ve Material Design
HTML and CSS basics. Divs, Sections, other HTML5 sections (header, footer, etc…) Foreground and background images. Inspection via browser. Reading: Material Design; intro, environment, material properties, elevation and shadows. Intro to HTML.
HTML5 sectionsbackground imagebrowser inspectionMaterial Design
Hafta 328 Eyl – 4 Eki
Material Design yüzeyleri ve görsel hiyerarşi
Material Design Surfaces and Elevation Visual Hierarchy & Hero Image Button addition - minor code tweaks + inline and block elements Reading: Material Design, Components - Cards.
Material Designelevationhero imageinline ve block elements
Hafta 45–11 Eki
Card component, CSS grid ve swiss style
UI Component: Card lecture and tutorial. Cards as basic and flexible layout elements. CSS grid. 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.
cardCSS gridwireframe & grid systemsswiss style
Hafta 512–18 Eki
CSS grid, responsive design ve breakpoint'ler
UI Component: CSS grid (continued) Basic typographic & color principles. Responsive design & media queries. Defining breakoints. Breakpoints are basically transition points between general devices. Process Check. Reading: Material Design, imagery & color.
CSS gridresponsive designmedia queriesbreakpoints
Hafta 619–25 Eki
Hero ve card bölümlerinin geliştirilmesi
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. work-in-progress: Refining Hero and Card sections.
heroheadermedia queriescard
Hafta 726 Eki – 1 Kas
Table tasarımı ve okunabilirlik
UI Component: Tables Improvements in readablity and aesthetics in a schedule design. Alternative table design without using element. Reading: Material Design, Data Styles.
tablesschedule designMaterial Design Data Styles
Hafta 82–8 Kas
Navbar ve modal box tasarımı
UI Component: Navbar & Modal Box Design. Navigation bar is a list. A set of choices that provide navigational context. Modal (or dialog) design to provide extra content and UI controls. They retain focus until dismissed. Tutorial on Pure CSS Modal windows. Reading: Material Design, Icons.
navbarmodal boxPure CSSMaterial Design Icons
Hafta 99–15 Kas
Location component'i ve harita tasarımı
UI Component: Location. Creating a map that fits the visual unity and consistency of a web page using various mapmaking tools.
locationmapmaking toolsvisual unity
Hafta 1016–22 Kas
Çeşitli section'lar ve process check
Miscelleneous sections (including break and other content sections). Process Check.
break sectioncontent sectionprocess check
Hafta 1123–29 Kas
Micro-Animation ve Term Project Kontrol Listesi
Extra content (micro-animations using animate.style) 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.
animate.stylemicro-animationstypographyfinal presentation
Hafta 1230 Kas – 6 Ara
Term project çalışması sürüyor
Term project work in progress.
term project
Hafta 137–13 Ara
Term project çalışması sürüyor
Term project work in progress.
term project
Hafta 1414–20 Ara
Term project ve Final Presentation hazırlığı
Term project work in progress.technicalities. Getting ready for the Final Presentation.
term projectFinal Presentation