Please enable JavaScript.

Coggle requires JavaScript to display documents.

delish_logo_white (Learning HTML, CSS, Javascript (Learning Platforms…

- - - - Shopping Cart vs. Bag / Basket
    - - Font
      - Logo, mascot?
      - Colours
        
        Suggestions
        
        Food on sale always
        
        Reds and yellows
        
        Natural and Fresh
        
        Green = money, green = fresh
        
        How to choose a brand colour palette
        
        Blog posts discussing each colour in depth
        
        Balancing cultural understanding of colours
        
        Description of colour wheel
        
        Colours vs Types of Consumers
        
        How to design colours for web app
        
        Examples of website colour schemes
    - - Ways to display price
        
        Examples
        
        Displaying Discounts
        
        Value Centric
        
        Price over unit sales - Luxury (high margin)
        
        1 more item...
        
        Trivago
        
        1 more item...
        
        Nespresso
        
        1 more item...
        
        Brand Dilution - Clearance: margin maintained by unit sales
        
        Unit sales over price - fast retail; (high contrast emphasis on discount)
        
        H&M
        
        1 more item...
        
        Loblaws
        
        1 more item...
        
        Walmart
        
        1 more item...
        
        GUESS? INC.
        
        1 more item...
        
        Types of Promotions
        
        Percent Discounts
        
        As for how to implement this offer, Mike says that storewide percentage discounts typically work best. “5% storewide, with few exceptions, will garner more attention and generate more sales than even a 60% off clearance, the next-best option.”
        
        “XX Dollars Off”
        
        Depends on the amount of dollars off. For luxury brands that often have more margin to discount, they will perform better than discount brands.
        
        Multi-Buys
        
        BOGO
        
        Used to move the most amount of inventory units.
        
        1 more item...
        
        Multi-Save and Conditional Promotions
        
        Multi-Save Promotions
        
        Buy and save off the entire sale.
        
        Spend and save off the entire sale.
        
        Buy and save off specific items.
        
        Spend and save off specific items.
        
        Buy and pay a fixed price.
        
        Conditional Promotions
        
        Buy and get one or more items for free or on discount.
        
        Spend and get one or more items for free or on discount.
        
        Buy and earn loyalty.
        
        Spend and earn loyalty.
      - Summary: Specific item discounts
        
        Brand dilution - Clearance
        
        Aka “Expiring Food / Sale” rack in grocery store
        
        Non-sustainable for purchasing regular price product
        
        Does not preserve customer attention on regular price items.
        
        Red or Yellow Font
        
        Value Centric
        
        Green font
        
        Maintains more margin by “manipulating” the value of items because of comparisons
        
        Loyalty / Point Programs
        
        Free shipping
        
        Try Before you Buy
        
        Trial time-frame
        
        e.g. Software Trials, “Adobe CC”
        
        Long Return period
        
        e.g. Mattress trials, “Endy”, “Casper”
- - - - SlideBean
        
        (Powered by AI)
      - Venngage
      - Envato
- - - - CSS Animations
      - Javascript Animations
      - SVG animations
      - Canvas Animations
      - WebGL
    - - Javascript Libraries
        
        GreenSock (GSAP)
        
        Dopper (intro animation)
        
        VelocityJS
        
        EXPLODE
        
        Anime.js
        
        Colour Changing
        
        Logo Animation 1
        
        Logo Animation 2
        
        Mo.js
        
        Examples
        
        ScrollMagic
        
        Examples
        
        Vivus
      - 3D Animations
        
        Three.js
        
        Example
      - Rendering After Effects Animations for the Web
        
        Lottie
        
        Your Cart is Empty!
        
        Rating Products
        
        Bodymovin
        
        Channel Surfing
    - - Loading
      - Welcome Animations
        
        Particles
        
        Background Video
        
        3D Animations
      - Scrolling
        
        One-page
        
        Scroll to Draw
        
        Background Changes
      - Sidebar Navigation
      - Visual Feedback
        
        Warning Animation
        
        Hover Animation
      - Story Telling
- - - - Page Type
        
        Mono-page
        
        Links in Header send user down the page to the section
        
        Add in demo page after
        
        w3School.com Template
        
        Multi-page
        
        Links in Header send user to different pages of the website
        
        Wireframes
        
        Introduction Animation
        
        To create storyboard for intro animation / frame pans: Wonderunit.com
        
        Code-Free Website Builders:
        
        To collaborate on wireframes: Adobe XD (free)
        
        “Bread crumb” Navigation