Cosmic JS Blog Stay tuned for community news, company announcements and updates from the Cosmic JS team.

Three Easy Steps for Rapid Prototyping



What is rapid prototyping?

Rapid prototyping is the process of quickly building a scale model for display to a client or partner, knowing that the prototype can be changed at a moment's notice. For a builder this could be an actual model, for a product it could be a mold model, and for an agency or development shop it could be a number of things. Many agencies will build rapid prototypes not just to display creative, websites & apps for clients, but to win the business in the first place by demonstrating a certain level of commitment to and understanding of the product or service at hand. Rapid prototyping allows the development team to participate in a faster feedback loop to get the best possible product while allowing the client to participate in the process. The constraints are usually time, money & technology infrastructure in terms of how that rapid prototype can be reviewed, and where. 


How are agencies currently handling rapid prototyping? 

In the creative agency world, there are numerous ways in which agencies will display creative work for their clients. Some have built proprietary galleries online that display comps pixel for pixel, some still print creative on 11" x 17" PDFs & others display a website example on a local server, hence forcing the clients of the agency to meet at the agency's offices for any type of digital presentation. There's nothing like displaying actual apps for clients to start planting vision seeds for how the creative will actually look and function in the wild.


Why use a web-based CMS? 

Cosmic JS is the ideal tool for rapid prototyping. Rather than displaying an idea for an application or website on your local server with the clients in your office for a brief meeting, or having printed screenshots of an app for display, simply build your app and quickly deploy on the Cosmic JS App Server, making it available for review on any device that has an internet connection. The client(s) having access anywhere allows them to provide feedback in real-time while also allowing the agency to quickly iterate on a design, content piece or structural component. The app can then be edited according to the client's direction and re-deployed with a custom domain for actual usage by the client once the rapid prototyping phase is over. 


Here are the three easy steps for agencies using Cosmic JS for rapid prototyping:

1. Integrate your GitHub repo with Cosmic JS 

2. Set up as many buckets as you would need for your rapid prototyping projects

3. Deploy buckets as the rapid prototype becomes ready for review 


Here are the three reasons Cosmic JS is best-suited for rapid prototyping projects:

1. No local server / stack set up to push to for display

2. Edit content in real time to adjust design accordingly (no lorem ipsum copy)

3. Once the rapid prototype is complete and approved, deploy on the Cosmic JS App Server with a custom domain

For more information on why Cosmic JS is the best solution for your rapid prototyping needs, read The Cosmic Stack to see the simplest content management stack on the market.

Cosmic JS is an API-first cloud-based CMS that gives developers and agencies portable, scalable & flexible content management solutions through its API that converts all content into JSON objects for consumption on any internet-connected device. 

You may also like


In this Developer Spotlight we sit down with Ben Packer, a web developer who's writing code for a cause.

We are always looking for ways to speed up the work flow for building apps and managing content.  And this new feature is sure to be a time-saver for many who use Object Relationship Metafields.  

It's now faster and easier to make the content on your webpages dynamic.  The Official Cosmic JS JavaScript Client now comes with a minified browser version that allows you to add the power of Cosmic JS cloud-hosted content into your HTML page with a single file.  Download the Cosmic JS browser file then copy and paste this real-working browser example into an html file to check it out:

<!DOCTYPE html>
<html>
<head>
  <title>Cosmic JS Easy Browser Example</title>
</head>
<body>
<h1 id="title">If you see this, something isn't working...</h1>
<div id="content"></div>
<div id="metafields"></div>
<script src="cosmicjs.browser.min.js"></script>
<script>
var config = {
  bucket: {
    slug: 'easy-browser-example'
  },
  object: {
    slug: 'home'
  }
};
Cosmic.getObject(config, config.object, function(err, res) {
  var object = res.object;
  document.getElementById('title').innerHTML = object.title;
  document.getElementById('content').innerHTML = object.content;
  var metafields = object.metafields;
  var images = '';
  metafields.forEach(function(metafield){
    images += '<h2>' + metafield.title + '</h2>';
    images += '<img width="300" src="https://cosmicjs.com/uploads/' + metafield.value + '"/>';
    images += '<br><br>';
  })
  document.getElementById('metafields').innerHTML = images;
});
</script>
</body>
</html>

Sign in to your Cosmic JS account and connect this example to one of your buckets to see how easy it is to create powerful CMS-powered websites and app with Cosmic JS.


We're excited to give you more with the Free plan.  Our new Free Plan makes it easier to try out additional features and get more right from the start.

In this installment of the Cosmic JS Developer Spotlight Series, we sat down with Owen Liversidge, a Web Developer residing in Atlanta, Georgia who's currently helping lead the development charge at renowned game development company Tripwire Interactive. Owen just built Tripwire's new corporate website on a React and Cosmic stack. Follow Owen on LinkedIn or GitHub, and enjoy the Q/A.

Medium has become the de-facto platform for publishing online content.  In this article, I'm going to show you how to build a Medium backup application using Node.js and Cosmic JS.