Awwwards Landing Page

rebyteai-template/rebyte-skills/awwwards-landing-page

by rebyteai-template0062e44684f109fb580e67fe600f581e01fa7209No licenseListed Oct 9, 2026Updated Oct 9, 2026

Designer portfolio with Locomotive Scroll, GSAP, and Framer Motion animations.

Instructions onlyDesign & Creative DevOps & Cloud

AI-generated overview

Scaffolds, builds and deploys an animated Next.js designer portfolio landing page template.

What it does: This skill sets up a Next.js portfolio landing page template that uses Locomotive Scroll, GSAP and Framer Motion for smooth scroll animations. It walks through cloning the template repository, installing dependencies, building the site, and deploying it to Vercel or Netlify. It also covers running the local development server on port 3000.
When to use it: Use it when you want to create or deploy an animated designer portfolio landing page based on this template. It suits projects that need a Next.js site with scroll-driven motion effects and a Vercel or Netlify deployment.
Requirements: Needs git, Node.js with npm or pnpm, and network access to clone the template repository and install packages. Deployment requires the Vercel CLI with a VERCEL_TOKEN, or the Netlify CLI. No environment variables are needed for the static site. It ships no scripts; it is instructions only.

Awwwards Landing Page

A stunning portfolio landing page with smooth scroll animations using Locomotive Scroll, GSAP, and Framer Motion.

Tech Stack

Framework: Next.js
Animation: Locomotive Scroll, GSAP, Framer Motion
Package Manager: pnpm or npm
Dev Port: 3000

Setup

1. Clone the Template

If the directory is not empty:

bash

git clone --depth 1 https://github.com/Eng0AI/awwwards-landing-page-template.git _temp_templatemv _temp_template/* _temp_template/.* . 2>/dev/null || truerm -rf _temp_template

git clone --depth 1 https://github.com/Eng0AI/awwwards-landing-page-template.git _temp_templatemv _temp_template/* _temp_template/.* . 2>/dev/null || truerm -rf _temp_template

2. Remove Git History (Optional)

3. Install Dependencies

Build

Deploy

CRITICAL: For Vercel, you MUST use vercel build --prod then vercel deploy --prebuilt --prod. Never use vercel --prod directly.

Vercel (Recommended)

bash

vercel pull --yes -t $VERCEL_TOKENvercel build --prod -t $VERCEL_TOKENvercel deploy --prebuilt --prod --yes -t $VERCEL_TOKEN

vercel pull --yes -t $VERCEL_TOKENvercel build --prod -t $VERCEL_TOKENvercel deploy --prebuilt --prod --yes -t $VERCEL_TOKEN

Netlify

Development

Opens at http://localhost:3000

Notes

Static Next.js site - no environment variables needed
Never run npm run dev in VM environment

Source and attribution

Source:rebyteai-template/rebyte-skillsinawwwards-landing-pageat commit0062e44

License: No license

Content belongs to its original authors. SourceWeft indexes it from a public repository.

Report or request removal

Awwwards Landing Page

Awwwards Landing Page

Tech Stack

Setup

1. Clone the Template

2. Remove Git History (Optional)

3. Install Dependencies

Build

Deploy

Vercel (Recommended)

Netlify

Development

Notes

Source and attribution

More from rebyteai-template/rebyte-skills

Gsap Awwwards Website

More in Design & Creative

Theme Factory

Slack Gif Creator

Frontend Design

Canvas Design

Brand Guidelines

Frontend Design