April 11, 2023 Training

Brand Identity to Web Design by Flux Academy on Youtube

Remember your audience

  • Your job is basically a translator. You must convert what assets you have into a format that will be understood and effective for your audience

Remember your brand

  • It’s your job to stay true to the brand while designing

Remember the content

  • Ensure that it does what your client needs it to, matches the client’s identity
  1. Wireframe
    1. Use 1920 px wide artboard divided into 12 columns with 30px margins
    2. Roughly lay out where your text and images should go
  2. Design
    1. Ensure that the fonts, colors, images, and layouts are inline with the brand
    2. Consider if there are add ons or other shortcuts you can use while designing
    3. Custom icons and copy are huge to making something match the brand
    4. Don’t forget the footers! Every part is important
  3. Present
    1. Gauge how the client feels
    2. Lead them through the experience
    3. Add in final content

Complete Guide to Starting Web Design by Flux Academy on Youtube

Beginners tend to use templates and focus on just getting the website live

Professionals strategize, begin with wireframes, and do more custom designs and animations/interactions

Masters do things with functional and content complexity as well as more complex animations/interactions

If you don’t have the exact font used for an existing logo, try to find a coordinating/matching font

Frontend Web Development Bootcamp Course by FreeCodeCamp

On a website, the html is the bricks, the css is the paint, and javascript is your plumbing/electric

Javascript is the programming language of the internet – it is versatile and powerful, but you have to understand the frameworks

A compiler is a program that reads other code and converts it into binary – most code goes through one

This goes into a lot of theory that isn’t super important for most people

Variables

console.log prints something, either by referencing it (1variable) or explicitly (‘hello world’)

// turns something into a comment

/* also turns something into a comment */

Use let when expect the variable to change, but use const when it’ll never change

A valid variable must be one word, no spaces

Some programming languages require you to specify what type of data you are using (number, string, boolean), and while it is optional in javascript, it is helpful for you to recognize what a piece of data is doing

You specify by putting strings inside single quotes, number values are written plainly, booleans will be written as true or false, and an array, which goes between square brackets and is separated by commas