Retail: Lucky Shrub

Based in Tuscon, Arizona, Lucky Shrub is a medium-sized garden design firm that specializes in garden design and creation, maintenance and landscaping. The company also runs a small plant nursery that sells indoor and outdoor plants, making them a one-stop shop for clients to "transform any space into an oasis you can be proud of".

Lucky Shrub was started by a husband and wife team, Jason and Maria, who share a long-time love for plants. Jason is the garden architect. He creates and oversees all designs while managing his team of landscapers. Maria manages all the marketing for the company and oversees the nursery.

Review criteria less When you submit your assignment, other learners in the course will review and grade your work. They will be looking for the following:

Visual layout

When viewing the home page in the browser:

• Is it clear that this is a home page for one of the four fictional clients?
• Is the correct company logo at the top of the page?
• Is there a horizontal navigation menu with four links below the logo?
• Does one of the links in the navigation menu link to the home page itself?
• Does the main content contain a large promotional banner at the top and three columns below it, each containing an image and some text?
• Does the page have a footer that is split into two columns?
• Does the left column of the footer contain a small version of the client logo and the right column copyright text?

Semantic structure

When opening the HTML file in VS Code, does it contain:

• A header element for the logo?
• A nav element for the navigation menu?
• A main element for the content?
• A footer element for the footer?
• Appropriate usage of other semantic tags such as article and section in the content of the main element?

CSS layout, styling and effects

When viewing the home page in the browser:

• Is the use of CSS styling effective?
• Is CSS used to create appropriate interactivity?
• When opening the CSS file in VS code, ask yourself the following:
• Is it a grid or flexbox layout?
• Does it have the appropriate selectors to style elements?
• Does it specify any pseudo-classes to create interactivity on the home page?
• Are any animations or transition effects used? Do they improve the user experience or distract from it?

Overall effect of the home page

• Does the home page create adequate interaction and a pleasing visual experience that is fitting for the client and its customers?
• Are CSS styling and effects used effectively to create intentional engagement?
• What works well?
• What advice can you give to improve the user experience, layout and visuals of the home page?