THE MOTIONSPACE GUIDE
From idea to your website
Find a design you love. Make it yours. We’ll walk you through it, one step at a time.
Your phone is enough. No coding experience needed.
Four steps. At your own pace.
Open the library and preview a design you like. Then select “Copy prompt.” If you’re asked to sign in or choose a plan, do that first, then return to the design.
A prompt is a ready-written description that tells your tool how to build the design you chose.
Open the libraryOpen one of the tools below, sign in, and start a new chat. Paste the prompt you copied from Motionspace, then add the example below to the same message before sending it.
Want to build and publish in one place? Try v0 by Vercel.
On your phone, press and hold inside the message box, then tap “Paste.”
Paste your design prompt first. Copying this example will replace what’s on your clipboard.
Build a website using this design for a photography studio called Noor. Write it in English and include our work, services, and contact details. Keep the design and motion. Ask me for any missing information, one question at a time, then help me open a preview of the website.
Replace “Noor” and the type of business with your own. Attach your logo and photos if you have them.
Look at the preview, then ask for one change in the same chat. You don’t need to know how it’s done. Just describe the result you want.
Change the main headline to “Your moments, beautifully told.” Keep the rest of the design exactly as it is.
For a visual change, attach a screenshot and point out the part you mean. You can ask to undo the last change if you don’t like it.
Add a section or refresh part of your website
The library is useful long after your first build. Choose a section or an interface element, like a navigation menu. Add it to your website or use it to replace an existing part.
- Open the section or element’s design in the library and select “Copy prompt.”
- Return to your current website project, open its chat, and paste the prompt.
- Add a suitable example below to the same message, then send it. Adjust the details to fit your website.
Paste the section prompt first. Copying the example will replace what’s on your clipboard.
Replace the design at the bottom of the page (the footer) using this prompt. Keep its links, contact details, and copyright text. Keep the rest of the website as it is.
Check the result on your phone and try the links. If you like it, publish the update. If you don’t, ask: “Undo the last change.”
Open the preview on your phone, read the text, and try the buttons. If you added a contact or booking form, send a test and check that you receive it.
Publish to Vercel with v0
If you built your website in v0, continue in the same project:
- Select Publish at the top of the chat.
- If asked for a Vercel account, create one or connect your existing account. Then confirm the project name.
- Make the website publicly accessible and choose the suggested vercel.app address.
- Select Publish and wait for it to finish. Open your website’s link and share it.
Built it with ChatGPT or Claude?
You can move it to v0 to publish on Vercel. In the chat where you built your website, send:
Prepare my complete website as a downloadable ZIP file so I can upload it to v0 and publish it on Vercel. Include the pages, images, and other files it needs, and preserve the design. If a feature needs connecting or you need me to do something, explain one simple step and wait for me to say “done.”
- Download the file to your device. On a phone, look in Files or Downloads.
- Open the v0 website in your browser and sign in. Start a new chat, select +, then Upload from computer, and choose your ZIP file.
- Send the message below and check the result, then follow the publishing steps above.
Run the website in this file and preserve its design and content. Fix anything preventing it from previewing or publishing. Ask me for any missing information one step at a time, then help me publish it on Vercel.
If your tool can’t create the file, you can start a version in v0: copy the first message you sent to build the website and paste it into a new chat there. Then ask for the changes you want to keep.
A video ad for your product
In Motion Studio, choose an example and add a clear product photo. Confirm or correct the product type, then choose a suggestion or write your own words for each sentence in English. Each box shows the original sentence and a word limit; leave it blank and we’ll help. An AI-generated presenter image is optional. Review the images and words before creating, then watch and download from My videos in your profile. Buying video credits requires an active subscription when sales open. Duration is fixed by the template. Review the cost, your balance and the complete videos and seconds it covers before creating. One-time purchased credits never expire. Website plans include monthly credits, with a choice of total before subscribing.
Explore Motion StudioA few things you might wonder
Small answers to keep you moving.
Can I really do this on my phone?
Yes. You can start from your phone without a laptop. Copy the prompt and open your preferred tool. On an iPhone, the v0 app lets you build, preview, and publish. If your tool only shows text, try v0 for the preview and publishing.
v0 for iPhoneOpens in a new windowHow do I edit my website after publishing?
Return to the project you published from and ask for a change, such as “Add product photography to the services section.” Check the preview, then in v0 select Publish followed by Publish Changes. Your website updates at the same address.
What if I don’t have text or photos yet?
Start with your project’s name and what you offer. Ask your tool: “Ask me about my business, then suggest short text for my website.” You can add your logo and photos later. Ask the tool to explain where to tap to attach them.
Do I need my own domain or another subscription?
You can start with the vercel.app address provided when you publish and add your own domain later. Building tools and hosting services have their own plans. Check what’s included and the price before confirming a subscription.
What if something breaks or doesn’t look right?
Send a screenshot in the same chat and say: “This is what I see. Help me fix it one step at a time, and keep the rest of the website as it is.” If the look has drifted from your chosen design, attach its image and point out the part you want to match.
Your starting point is waiting.
A design you love. An idea of your own. One step at a time.
Explore the libraryNeed a hand from Motionspace? Get in touch