[go: up one dir, main page]
Scribd
Upload
15 views3 pages

Webflow Assignment

The objective is to develop a fully responsive Webflow page for the 'Aluminum Systems' service based on a provided Figma design. Key requirements include precise design fidelity, implementation of animations, ensuring responsiveness, maintaining a clean structure, and using optimized content. The final deliverables include a Webflow preview link and notes on any deviations from the design.

Uploaded by

mylifestyle080196
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
15 views3 pages

Webflow Assignment

The objective is to develop a fully responsive Webflow page for the 'Aluminum Systems' service based on a provided Figma design. Key requirements include precise design fidelity, implementation of animations, ensuring responsiveness, maintaining a clean structure, and using optimized content. The final deliverables include a Webflow preview link and notes on any deviations from the design.

Uploaded by

mylifestyle080196
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Objective

Begin by going through our current website: www.rayfitout.com then develop a fully responsive Webflow
page for “Aluminum Systems” service based on the provided Figma design. This assignment will be used
to test your development skills, thinking, and ability to follow instructions. The Web page must be
developed on Webflow.

1. Design Fidelity

o Match all layout spacings, paddings, and margins precisely as shown in the Figma file.

o Use the exact fonts, sizes, weights, and colors specified.

o Maintain correct text alignment and justification per design — do not alter spacing or
formatting unless instructed.

2. Animations

o Implement scroll and hover animations based on the provided animation reference.

o Timing, easing, and trigger behavior should be aligned with the reference.

3. Responsiveness

o Ensure smooth and intuitive responsiveness across desktop

4. Structure & Logic

o Keep your section and class naming clean and organized for easy updates.
o Ensure components are logically grouped and maintain readable structure for future
scalability.

5. Content & Assets

o Use optimized images and graphic assets as per the Figma.

o All text content must be copied exactly as written in the design — no typos or formatting
errors.

6. Final Checks

o Verify all sections match the Figma design pixel-for-pixel.

o Confirm the site is fully responsive.

o Double-check animation behavior.

Review Process:
After the first draft, submit a Webflow preview link. We will review the build and provide feedback for
any necessary refinements before final approval.

Deliverables:
• Final Webflow preview link

• Notes on any deviations from the design (if necessary)


FONT TYPE: MONT

FIGMA DESIGN: ALUMINUM SYSTEMS

ANIMATION REF IS INCLUDED IN MESSAGE

You might also like