A

Ammara Gul - Aspiring Web Developer

Responsive Typographic Techniques

  1. 1).Section 1 covers the important factors and tips while choosing font for your webpage.It also shows some tools which can help for choosing most suitable font for yor requirements.Instructor also shows factors to reduce page weight while selecting font options.
  2. 2).Implementing a Modular Scale
  3. 3).section 3 is about setting up and populating prototype pages.Features of prototype pages are:
    i):A shortlist of typefaces.
    ii):Real Content.
    iii):The approximate colors and layout of your project.
  4. 4).Using Media Queries to set Natural Breakpoints
  5. 5).Section 5 is about Previewing web type choices with the Typecast app.It also shows tools for previwing type and media queries.

Photoshop for WebDesign

  1. 1)First section is about setting your project e.g customising your workspace and colormode settings.It also shows how to buy images through adobe stock and how to setup your libaries.
  2. 2).Layer Comps
  3. 3).Seamless Textures and Backgrounds
  4. 4).Smart Objects
  5. 5).Create Comps
  6. 6).Stlye Guides and Client Review Comps
  7. 7)This section is about image considerations that which type of image is most appropriate according to web requirements.
  8. 8)This section is about how to export images from photoshop quickly and effectively.

Graphic Design Foundations:Layout and Compositon

  1. 1)Section 1 describes about main elements of a layout.Shape,color,text,negative space are very important factors and should be used after a lot of consideration so that design is eye catching and focused.
  2. 2)Second section is about composition principles.Contrast,Scale,Harmony,Repetition and Hierarchy are major building blocks in a good design.
  3. 3)This section is about proportions of a design.Golden Section,proportions of square and Rule of Thirds are some tools used to bring symmetry in design.Its not necessary that every design should be symmetrical.It depends on the requirements.
  4. 4)Section 4 is about grids.It talks about anatomy of Grid and choosing and creating a right grid to create a design.
  5. 5)This section is about Attributes.Design should be simple and focused.It should ne consistent but too much consistency will make it boring.There should be some element of surprise to create drama.
  6. 6)Images are so much powerful in conveying meanings.Images and words work together to give a strong design.

Graphic Design Foundation:Color

  1. 1)First section is about how color Shapes meaning.Every color Symbolises a meaning which can be different in different cultures.It also shows how different colors and patterns creates certain brand identity.
  2. 2)This section is about color wheels.It informs about primary,complementary and tertiary colors.It gives ideas how the colors should be mixed to gain the desired color according to the situation.Bright colors are more vibrant and create more contrast and focus.
  3. 3)Third section is about Elements of Color.Value,saturation,neutral,temperature,texture and opacity are elements of color.by controling and balancing these elements you can have total control on your image/design.
  4. 4)This section is about contrast.Contrast is used to create focal point in image.Its human nature to see highest contrast point first so to build a good design contrast should be used wisely.
  5. 5)section 5 is about effect of light in an image.
  6. 6)This section is about choosing right Color Palettes.Creating harmony and connections are our ways to make all the parts in the piece as whole but too much harmony can bring bordom in design.
  7. 7)This section is about color shape,Texture and Context.

Sketch Essential Training:The Basics

  1. 1) File Setup
  2. 2) Create the Calandar icon using library items
  3. 3) Complete The web Layout
  4. 4) Web design for a small sceen
  5. 5) Web Design for a smaller sceen
  6. 6) This section is about how to share and callobrate your work via export to pdf or sketch cloud.
  7. 7) This section is about how to export assets e.g artboards to jpg and png.it also shows how to use slice tools and how to export images in multiple sizes.

Sketch:Style Guides and Asset Libraries

  1. First section is about how to maintain/organize properly your asset Library.
  2. Second section is about creating an Asset Library in sketch.it gives details of importing and creating assets,naming your assets and documenting specifications for your style guide.
  3. Third Section is about sharing your Asset Library.It shows some online tools/app to publish yur style guide e.g zeplin.It also shows to create an interactive online preview of styleguide by FlintoLite.