MotionSites-inspired websites

# Design reference: Maria Vasilyeva Portfolio
Source: https://www.awwwards.com/sites/maria-vasilyeva-portfolio
Swipefile reference: https://swipefile.design/ref/ms26-websites-maria-vasilyeva-portfolio/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. An oversized editorial serif headline, sparse black-and-white layout, and disciplined alignment create a strong portfolio opening. Credit: Maria Vasilyeva, Surya Aditya. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Odyssée
Source: https://www.awwwards.com/sites/odyssee
Swipefile reference: https://swipefile.design/ref/ms26-websites-odyssee/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Reflective rounded forms and delicate type create a quiet, sculptural visual direction for a clinic website. Credit: NIGHTJAR. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: twks
Source: https://www.awwwards.com/sites/twks-1
Swipefile reference: https://swipefile.design/ref/ms26-websites-twks-1/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A lush green tunnel of organic forms frames a bright center, creating an immersive studio introduction. Credit: twks. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Santioni Spirits
Source: https://www.awwwards.com/sites/santioni-spirits
Swipefile reference: https://swipefile.design/ref/ms26-websites-santioni-spirits/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A red product page pairs an expressive white serif headline, a dimensional spirits bottle and visible navigation. Credit: Active Theory, plan8. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: EDOLUS
Source: https://www.awwwards.com/sites/edolus
Swipefile reference: https://swipefile.design/ref/ms26-websites-edolus/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Orbital imagery, a sweeping planetary horizon, and bold white typography establish a cinematic technology narrative. Credit: Yann Trevelot / Vertex3D. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Tengile Malamala Collection
Source: https://www.awwwards.com/sites/tengile-malamala-collection
Swipefile reference: https://swipefile.design/ref/ms26-websites-tengile-malamala-collection/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Large elegant typography overlays warm lodge photography, balancing a luxury-travel atmosphere with a strong opening message. Credit: DashDigital, Ingamana. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Ten Years Away
Source: https://www.awwwards.com/sites/ten-years-away
Swipefile reference: https://swipefile.design/ref/ms26-websites-v2-ten-years-away/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. An editorial book website combines oversized condensed type, a richly illustrated cover and clearly placed project information. Credit: Studio375, Daniel Bassan. Awwwards Site of the Day design presentation; credited static website preview. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: CoMinVi
Source: https://www.awwwards.com/sites/cominvi
Swipefile reference: https://swipefile.design/ref/ms26-websites-cominvi/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A cinematic mining landscape supports a clear white headline, navigation and a project carousel; the page replaces the earlier standalone wordmark cover. Credit: HOLOGRAPHIK. Static capture of the live website, visually checked; source link credits the Awwwards design entry. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Jesper Landberg
Source: https://www.awwwards.com/sites/jesper-landberg-4
Swipefile reference: https://swipefile.design/ref/ms26-websites-jesper-landberg-4/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Curved project panels in a dark three-dimensional space present portfolio work as an immersive exhibition. Credit: Jesper Landberg. Static capture of the live website, visually checked; source link credits the Awwwards design entry. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Butter
Source: https://www.awwwards.com/sites/butter
Swipefile reference: https://swipefile.design/ref/ms26-websites-butter/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Floating product icons and restrained gray typography create a playful but spacious studio presentation. Credit: ToyFight. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Realevate
Source: https://www.awwwards.com/sites/realevate
Swipefile reference: https://swipefile.design/ref/ms26-websites-realevate/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Oversized navy typography, bright architecture, and a centered white information panel establish a refined property direction. Credit: Or Halevi, MAKETHECUT®. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: The Tie-break
Source: https://www.awwwards.com/sites/the-tie-break
Swipefile reference: https://swipefile.design/ref/ms26-websites-the-tie-break/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Blurred sporting imagery, fine grid lines, and expressive serif type create an editorial campaign composition. Credit: Merci Michel. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Sobha Privy Collection
Source: https://www.awwwards.com/sites/sobha-privy-collection
Swipefile reference: https://swipefile.design/ref/ms26-websites-sobha-privy-collection/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Restrained serif typography and dark, tactile imagery produce a quiet luxury-property presentation. Credit: Vide Infra. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: bleibtgleich'26
Source: https://www.awwwards.com/sites/bleibtgleich26
Swipefile reference: https://swipefile.design/ref/ms26-websites-bleibtgleich26/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A black-and-white portfolio combines bold stacked typography with a stepped Home, Work and Contact navigation. Credit: The First The Last, Maksym Bleibtgleich. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Gil Huybrecht
Source: https://www.awwwards.com/sites/gil-huybrecht
Swipefile reference: https://swipefile.design/ref/ms26-websites-gil-huybrecht/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Small portfolio thumbnails arranged against a deep black field create a dense but controlled visual index. Credit: Gil Huybrecht, Jesper Landberg. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Boc.Studio
Source: https://www.awwwards.com/sites/boc-studio
Swipefile reference: https://swipefile.design/ref/ms26-websites-boc-studio/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A bright red studio information page uses a disciplined editorial grid for services, clients, profile and contact details. Credit: Boc.Studio. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Noho
Source: https://www.awwwards.com/sites/noho
Swipefile reference: https://swipefile.design/ref/ms26-websites-noho/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A cream furniture website pairs a bold positioning statement with a colorful tiled product and portrait gallery. Credit: Eugene Morev, Alex Ivanov. Static capture of the live website, visually checked; source link credits the Awwwards design entry. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Lidar Drone Scanning
Source: https://www.awwwards.com/sites/lidar-drone-scanning
Swipefile reference: https://swipefile.design/ref/ms26-websites-v2-lidar-drone-scanning/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A restrained white website hero combines a dimensional drone, outlined oversized typography, navigation and product information. Credit: Riotters. Awwwards Site of the Day design presentation; credited static website preview. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: The Tuscan Journey Begins
Source: https://www.awwwards.com/sites/the-tuscan-journey-begins
Swipefile reference: https://swipefile.design/ref/ms26-websites-the-tuscan-journey-begins/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Large cream type, travel photography, and striped graphic framing create an energetic destination narrative. Credit: MONOGRID. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Warm & Fuzzy
Source: https://www.awwwards.com/sites/warm-fuzzy
Swipefile reference: https://swipefile.design/ref/ms26-websites-warm-fuzzy/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A dark portfolio work index uses a generous three-column grid of cinematic and dimensional projects. Credit: Neutral Studio, Paulo Ferreira Jorge, warmnfuzzy.tv. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: White Desert
Source: https://www.awwwards.com/sites/white-desert
Swipefile reference: https://swipefile.design/ref/ms26-websites-white-desert/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Immersive blue ice photography and a very large condensed destination label create a powerful travel hero. Credit: Malvah. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Cerebrium
Source: https://www.awwwards.com/sites/cerebrium
Swipefile reference: https://swipefile.design/ref/ms26-websites-cerebrium/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Deep purple folded forms, bright pink accents, and restrained white text create a premium AI-infrastructure direction. Credit: Louis Paquet. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Seasats
Source: https://www.awwwards.com/sites/seasats
Swipefile reference: https://swipefile.design/ref/ms26-websites-seasats/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A calm maritime photograph and large light serif type communicate advanced hardware through a spacious editorial composition. Credit: Raw Materials. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Why Zero
Source: https://www.awwwards.com/sites/why-zero
Swipefile reference: https://swipefile.design/ref/ms26-websites-why-zero/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Surreal hands, misty scenery, and a simple central wordmark create a distinctive technology-and-nature composition. Credit: Sindhur Dutta. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: United Carriers
Source: https://www.awwwards.com/sites/united-carriers
Swipefile reference: https://swipefile.design/ref/ms26-websites-united-carriers/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A luminous globe and oversized white type anchor a freight website with clear navigation and inquiry controls. Credit: Bearplus, Kenny Ho. Static capture of the live website, visually checked; source link credits the Awwwards design entry. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: HOBRO DIGITAL
Source: https://www.awwwards.com/sites/hobro-digital
Swipefile reference: https://swipefile.design/ref/ms26-websites-hobro-digital/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A monochrome studio services page combines overlapping display typography, a service list and visible site navigation. Credit: Hobro Digital. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: The Watch
Source: https://www.awwwards.com/sites/the-watch
Swipefile reference: https://swipefile.design/ref/ms26-websites-the-watch/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A mechanical watch story pairs a dimensional movement, organic linework, editorial labels and oversized section numbering. Credit: 60fps. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Pacôme Pertant Portfolio
Source: https://www.awwwards.com/sites/pacome-pertant-portfolio
Swipefile reference: https://swipefile.design/ref/ms26-websites-v2-pacome-pertant-portfolio/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A designer portfolio presents a dimensional floating project gallery inside a clear browser-like site frame with navigation. Credit: Louis Bocquet, Colin Demouge. Awwwards Site of the Day design presentation; credited static website preview. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Julien Calot
Source: https://www.awwwards.com/sites/julien-calot
Swipefile reference: https://swipefile.design/ref/ms26-websites-julien-calot/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. An artist project page combines a vivid painting with generous whitespace, project details and clear top navigation. Credit: FLOT NOIR, Clement Merouani, Moussa Mamadou. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Depo Luxe
Source: https://www.awwwards.com/sites/depo-luxe
Swipefile reference: https://swipefile.design/ref/ms26-websites-depo-luxe/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A dark film portfolio pairs a centered director name with a disciplined grid of cinematic work and navigation. Credit: Cuchillo. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Units
Source: https://www.awwwards.com/sites/units
Swipefile reference: https://swipefile.design/ref/ms26-websites-units/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Color-coded navigation and a deep perspective grid make a student-living concept feel graphic and highly structured. Credit: Big Horror Athens. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Meech213
Source: https://www.awwwards.com/sites/meech213
Swipefile reference: https://swipefile.design/ref/ms26-websites-meech213/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Editorial portraiture and overlapping magazine-like image panels give a fashion portfolio a strong visual hierarchy. Credit: The Blackpepper Studio. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Podium
Source: https://www.awwwards.com/sites/podium
Swipefile reference: https://swipefile.design/ref/ms26-websites-podium/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A sports studio page uses strong black uppercase editorial typography, navigation and a visible behind-the-scenes section. Credit: San Rita. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: IL CAPO PRODUCTION
Source: https://www.awwwards.com/sites/il-capo-production
Swipefile reference: https://swipefile.design/ref/ms26-websites-il-capo-production/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Huge red lettering contrasts with a soft editorial portrait for a bold production-company presentation. Credit: AUGE EXPERIENCE. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: EverSwap
Source: https://www.awwwards.com/sites/everswap
Swipefile reference: https://swipefile.design/ref/ms26-websites-everswap/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. An idealized three-dimensional mountain landscape and elegant white serif type create an immersive finance direction. Credit: Lusion. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: digitalists
Source: https://www.awwwards.com/sites/digitalists-1
Swipefile reference: https://swipefile.design/ref/ms26-websites-digitalists-1/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. An agency website combines cinematic imagery, yellow accents, a readable positioning statement and a structured navigation bar. Credit: digitalists. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: RPA COMUNICACIÓN
Source: https://www.awwwards.com/sites/rpa-comunicacion
Swipefile reference: https://swipefile.design/ref/ms26-websites-rpa-comunicacion/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Saturated red fields, layered images, and scattered oversized words create a bold communication-studio composition. Credit: LaNegrita. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Indigo Laboratory
Source: https://www.awwwards.com/sites/indigo-laboratory
Swipefile reference: https://swipefile.design/ref/ms26-websites-indigo-laboratory/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A jewelry collection page uses a clean horizontal product grid, visible navigation and atmospheric fashion imagery. Credit: FPTP Studio. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Elva
Source: https://www.awwwards.com/sites/elva
Swipefile reference: https://swipefile.design/ref/ms26-websites-elva/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Reflective clustered spheres and oversized soft-focus text create an atmospheric technology-product presentation. Credit: Lazarev.. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: sakazuki
Source: https://www.awwwards.com/sites/sakazuki
Swipefile reference: https://swipefile.design/ref/ms26-websites-sakazuki/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A black-and-red editorial website uses oversized SAKA ZUKI typography, artist information and clear collection navigation. Credit: Shun_Kudo. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Crav Burgers
Source: https://www.awwwards.com/sites/crav-burgers
Swipefile reference: https://swipefile.design/ref/ms26-websites-crav-burgers/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Oversized red typography, a central burger, and a vivid yellow field create an energetic food-commerce hero. Credit: Vasav Prajapati, Anyflow, Pritam Das, Gaurav Verma. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Hubtown
Source: https://www.awwwards.com/sites/hubtown
Swipefile reference: https://swipefile.design/ref/ms26-websites-hubtown/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. An illuminated blue monolith in a dark landscape gives a real-estate concept a strong futuristic visual anchor. Credit: Unseen Studio. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: 20 Years Inspired by People
Source: https://www.awwwards.com/sites/20-years-inspired-by-people
Swipefile reference: https://swipefile.design/ref/ms26-websites-20-years-inspired-by-people/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A green editorial story page pairs a refined serif headline with navigation and a visible invitation to explore the archive. Credit: /nk.studio. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Hearst Exhibit 2026
Source: https://www.awwwards.com/sites/hearst-exhibit-2026
Swipefile reference: https://swipefile.design/ref/ms26-websites-hearst-exhibit-2026/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Floating editorial images and fine white serif type form a dramatic exhibition composition against black. Credit: OSMOS. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Noomo Showcase
Source: https://www.awwwards.com/sites/noomo-showcase
Swipefile reference: https://swipefile.design/ref/ms26-websites-noomo-showcase/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A cobalt studio website combines oversized manifesto typography, a dimensional cube and a clear navigation bar. Credit: Noomo Agency. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: 2xA Studio
Source: https://www.awwwards.com/sites/2xa-studio
Swipefile reference: https://swipefile.design/ref/ms26-websites-2xa-studio/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A dark experimental studio website uses dotted display type, a visible project grid and a clear navigation bar. Credit: 2xA Studio. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: CIAO ENERGY - LAUNCH WEBSITE
Source: https://www.awwwards.com/sites/ciao-energy-launch-website
Swipefile reference: https://swipefile.design/ref/ms26-websites-ciao-energy-launch-website/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. Sculptural beverage cans, a dark stage, and purple lighting turn a product launch into a dramatic showcase. Credit: Skaald. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Made With Gsap
Source: https://www.awwwards.com/sites/made-with-gsap-1
Swipefile reference: https://swipefile.design/ref/ms26-websites-made-with-gsap-1/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A simple light layout frames small colorful interaction examples, keeping technical work easy to scan. Credit: Florent Roux-Durraffourt, Michael Garcia, Manoir, Inc.. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: Obys® Experiment Space
Source: https://www.awwwards.com/sites/obys-r-experiment-space
Swipefile reference: https://swipefile.design/ref/ms26-websites-obys-r-experiment-space/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A monochrome portfolio pairs a large editorial heading with an interactive carousel of project previews and visible navigation. Credit: Obys. Static capture of the live website, visually checked; source link credits the Awwwards design entry. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

# Design reference: TRIONN
Source: https://www.awwwards.com/sites/trionn-2
Swipefile reference: https://swipefile.design/ref/ms26-websites-trionn-2/
Captured: 2026-10-11. This is a dated reference, not a claim about the current live product.
Source scope: static designer or award presentation. This may be concept or case-study artwork. Do not infer working features, unseen screens, or tested interactions.

## Objective
Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets.

## Reference notes
Websites reference. A dimensional abstract symbol, dark materials, and restrained oversized type create a premium creative-studio opening. Credit: Trionn. Awwwards designer-published website gallery; a static page-design preview, not a guarantee of current live interactions. Visually reviewed for the MotionSites-inspired collection.

## Acceptance criteria
- Existing project conventions, design tokens, working functionality, and unrelated changes are preserved.
- Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product.
- Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap.
- Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled.
- Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported.
- Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service.

## Quality bar
Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.