The latest articles on Forem by boomcatalyst (@boomcatalyst). https://forem.com/boomcatalyst https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F800072%2Fed330d01-5eee-4148-83c5-acf517b55c03.jpeg https://forem.com/boomcatalyst en boomcatalyst Thu, 20 Jan 2022 15:44:09 +0000 https://forem.com/ieeemace/create-a-website-without-code-4a91 https://forem.com/ieeemace/create-a-website-without-code-4a91 <p>Convert your designs into responsive, live websites automatically. Add interactions, motion graphics, video, audio <em>without writing any code</em>. Connect to data and content source and build fully functioning websites, landing pages, HTML emails, product pages, or business applications easily. There are many platforms that allows you to build responsive websites without a single line of code. One such platform is <a href="https://quest.ai" rel="noopener noreferrer">Quest</a><br> With Quest, anyone can build what they envision without being constrained by their engineering bandwidth. </p> <h2> How to start </h2> <p>Go to quest.ai. Then signup for free using <em>Build For Free</em> button. Make sure to select <em>The new quest</em> tile during sign up. </p> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fk6kxxtltln733cbg2hcb.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fk6kxxtltln733cbg2hcb.jpeg" alt="Image description"></a></p> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Flkdyzok6hgv0tz7qek90.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Flkdyzok6hgv0tz7qek90.jpeg" alt="Image description"></a></p> <p>After signup, you’ll be directed to a page shown below <br> <a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqbrdwgtudojkticd34b4.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqbrdwgtudojkticd34b4.jpeg" alt="Image description"></a></p> <p>Quest is more of like a web hosting. For design of the web page, you can use either Adobe XD or <em>Figma.</em> Select the <em>Quest plugin for Figma</em> on top middle of the page. Now you will be directed to Figma plugin page as shown below. </p> <ul> <li>Click on the <em>Download</em> button <img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faxf8nugs8ujj0ajsrhva.jpeg" alt="Image description"> </li> </ul> <p>and you will be directed to a page where you can select <em>Install</em> for installing the plugin. </p> <ul> <li>You will be asked to sign up to Figma. Complete the process </li> </ul> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fixvlma3pmmf1klgbvi98.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fixvlma3pmmf1klgbvi98.jpeg" alt="Image description"></a></p> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs7m7kea07249xt1xfk57.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs7m7kea07249xt1xfk57.jpeg" alt="Image description"></a></p> <p>After login you will be directed to a page where you can start creating your design by selecting <em>New design file. To learn more about how to design in Figma, use **resource</em> section at the bottom of the Figma home page or <em>help.figma.com</em> </p> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3hftqgn9wreef4oj9esc.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3hftqgn9wreef4oj9esc.jpeg" alt="Image description"></a></p> <p>After completing the design in Figma, you need to connect Figma and Quest using a plugin. For that go to plugin option on the dropdown menu and select <em>manage plugin</em> under <em>plugins.</em></p> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frsvln9hhffrokm1y262d.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frsvln9hhffrokm1y262d.jpeg" alt="Image description"></a></p> <ul> <li>Click on the <em>Browse plugin on community</em> and search for <em>Quest</em> <img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdc74md8ym0c9a2s1rx3i.jpeg" alt="Image description"> </li> </ul> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fl2z6tngzy6rtn4sgvmn2.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fl2z6tngzy6rtn4sgvmn2.jpeg" alt="Image description"></a></p> <p>Now, go back to the design space and select Quest under plugin. <a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpxvifbr7ihrwcgo0n1ay.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpxvifbr7ihrwcgo0n1ay.jpeg" alt="Image description"></a></p> <p>This will show up a box as shown below. Give a name for the design and select the layers that has to be imported to quest and click export. </p> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F7ie0lbep6sl6aifwjh41.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F7ie0lbep6sl6aifwjh41.jpeg" alt="Image description"></a></p> <p>You can now see you design in quest work window just by selecting <em>View in Quest</em>. </p> <p><a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0fykyh89ye0lbznkai8f.jpeg" class="article-body-image-wrapper"><img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0fykyh89ye0lbznkai8f.jpeg" alt="Image description"></a></p> <p>Inside Quest you can make you design adjustable to different screen sizes like laptops, tablets, smartphones etc. You can also launch your design into a custom domain if you had bought one already. </p> <p>To know more on how to work with <em>Quest</em> visit the resource section at the top of Quest homepage or visit <strong><a href="//www.quest.ai/docs">www.quest.ai/docs</a></strong> </p> <pre><br><br> ❤️ <a href="https:ieeemace.org" rel="noopener noreferrer">Website</a> | 📷<a href="https://www.instagram.com/ieeemace" rel="noopener noreferrer">Instagram </a> | 💼<a href="https://in.linkedin.com/company/ieeemace" rel="noopener noreferrer">LinkedIn</a> | 🐥<a href="https://twitter.com/ieeemace" rel="noopener noreferrer">Twitter</a><br><br><br> </pre>