Yasmeen AfifiGet started

Welcome
to the world of

building on Readymag

What this is

A resource guide on how I made my portfolio and the Readymag Agent Skill built to audit and maintain it!

Your discount

10% off any plan

Skill level needed

a vision + good taste

Start on Readymag →

01 — My Process

How I built my dream website

Purpose

I set my intention in making my dream website to give people a glimpse into my world. I wanted it to reflect my aesthetic and work so that it leads to a connection or a conversation.

Collect

I identified all the work, press highlights, and art that I wanted to feature in my website and organized all the footage, descriptions, and context to organize all the content across pages.

Creative Direction

I created a Pinterest board for 'paper archive' design inspiration and then brought it to life through a print project. Dive into the details here.

Compose

Readymag lets you drag and drop anything anywhere, build animations, and create horizontal scrolling pages. I optimized my website design for desktop then customized across mobile and tablet using the open-source Readymag Agent Skill built with NoobianLabs.

Custom Readymag Agent Skill

I built a custom Readymag Agent Skill with NoobianLabs to troubleshoot animations, fix layout issues, and audit my site across every screen size. Now you can use the Readymag Agent Skill to audit and maintain your website!

see the final creation → yasmeenafifi.xyz

02 — Enhance with Readymag Agent Skill

Get set up in 4 steps

  1. 1

    Sign up for Readymag

    Use code yasmeen10 at checkout for 10% off your plan.

  2. 2

    Download the skill

    Go to the Readymag Agent Skill's GitHub page, click Code → Download ZIP, and unzip it.

  3. 3

    Connect the skill to your agent

    Open the skills/readymag folder → Keep SKILL.md and the references folder together. Give your agent (Claude Code, Codex or OpenCode) access to that folder.

  4. 4

    Run an Audit

    Start your session with this prompt, then brief it like you would a collaborator: details, context and goal.

Your message

Read the SKILL.md file in this folder and use its relevant references to help enhance, troubleshoot, and audit my website made on Readymag. My task is: [describe exactly what you're trying to achieve].

Get the skill on GitHub →

This Readymag Agent Skill is powered by NoobianLabs.

TRY PROMPTING…

  • “Audit my site on phone and tablet: [your site URL]”
  • “Help me create a horizontal scroll page using [your material].”
  • “My scroll animation never finishes — what's stuck? [your site URL]”
  • “Walk me through connecting my custom domain”

Golden rules

  • Use a working copy. Duplicate your project before letting the agent skill edit it.
  • Back up first. Save a backup before any changes.
  • Review every change on desktop, tablet and mobile before publishing.
  • Press Publish. Go live with your updates.

03 — Learn Readymag

Tutorials & workshops

Your turn

Start your Readymag site with 10% off. Stuck on anything? Send me an email.

Start on Readymag →
fusciafifi@gmail.com

Affiliate note: I may earn a commission when you sign up with my code. © Yasmeen Afifi