diff --git a/examples/with-universal-configuration/.babelrc.js b/examples/with-universal-configuration-build-time/.babelrc.js
similarity index 100%
rename from examples/with-universal-configuration/.babelrc.js
rename to examples/with-universal-configuration-build-time/.babelrc.js
diff --git a/examples/with-universal-configuration/README.md b/examples/with-universal-configuration-build-time/README.md
similarity index 54%
rename from examples/with-universal-configuration/README.md
rename to examples/with-universal-configuration-build-time/README.md
index fadae723..d6998818 100644
--- a/examples/with-universal-configuration/README.md
+++ b/examples/with-universal-configuration-build-time/README.md
@@ -1,4 +1,4 @@
-[![Deploy to now](https://deploy.now.sh/static/button.svg)](https://deploy.now.sh/?repo=https://github.com/zeit/next.js/tree/master/examples/with-universal-configuration)
+[![Deploy to now](https://deploy.now.sh/static/button.svg)](https://deploy.now.sh/?repo=https://github.com/zeit/next.js/tree/master/examples/with-universal-configuration-build-time)
 
 # With universal configuration
 
@@ -9,9 +9,9 @@
 Execute [`create-next-app`](https://github.com/segmentio/create-next-app) with [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) or [npx](https://github.com/zkat/npx#readme) to bootstrap the example:
 
 ```bash
-npx create-next-app --example with-universal-configuration with-universal-configuration-app
+npx create-next-app --example with-universal-configuration-build-time with-universal-configuration-build-time-app
 # or
-yarn create next-app --example with-universal-configuration with-universal-configuration-app
+yarn create next-app --example with-universal-configuration-build-time with-universal-configuration-build-time-app
 ```
 
 ### Download manually
@@ -19,18 +19,18 @@ yarn create next-app --example with-universal-configuration with-universal-confi
 Download the example:
 
 ```bash
-curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-universal-configuration
-cd with-universal-configuration
+curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-universal-configuration-build-time
+cd with-universal-configuration-build-time
 ```
 
 Install it and run:
 
 ```bash
 npm install
-npm run dev
+VARIABLE_EXAMPLE=next.js npm run dev
 # or
 yarn
-yarn dev
+VARIABLE_EXAMPLE=next.js yarn dev
 ```
 
 Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download))
@@ -41,9 +41,13 @@ now
 
 ## The idea behind the example
 
-This example show how to set custom environment variables for your application based on NODE_ENV using [transform-define](https://github.com/FormidableLabs/babel-plugin-transform-define).
+This example shows how to use environment variables and customize one based on NODE_ENV for your application using [transform-define](https://github.com/FormidableLabs/babel-plugin-transform-define)
+
+When you build your application the environment variable is transformed into a primitive (string or undefined) and can only be changed with a new build. This happens for both client-side and server-side. If the environment variable is used directly in your application it will only have an effect on the server side, not the client side.
+
+To set the environment variables in runtime you can follow the example [with-universal-configuration-runtime]((https://deploy.now.sh/?repo=https://github.com/zeit/next.js/tree/master/examples/with-universal-configuration-runtime))
 
 ## Caveats
 
 - Because a babel plugin is used the output is cached in `node_modules/.cache` by `babel-loader`. When modifying the configuration you will have to manually clear this cache to make changes visible. Alternately, you may skip caching for `babel-loader` as shown [here](https://github.com/zeit/next.js/issues/1103#issuecomment-279529809).
-- This example sets the environment configuration at build time, meaning the same build might not be used in e.g. both staging and production. For a solution which sets the environment at runtime, see [here](https://github.com/zeit/next.js/issues/1488#issuecomment-289108931). 
+- This example sets the environment configuration at build time, meaning the same build might not be used in e.g. both staging and production. For a solution which sets the environment at runtime, see [here](https://github.com/zeit/next.js/issues/1488#issuecomment-289108931).
diff --git a/examples/with-universal-configuration/env-config.js b/examples/with-universal-configuration-build-time/env-config.js
similarity index 59%
rename from examples/with-universal-configuration/env-config.js
rename to examples/with-universal-configuration-build-time/env-config.js
index f8620ab4..390e1632 100644
--- a/examples/with-universal-configuration/env-config.js
+++ b/examples/with-universal-configuration-build-time/env-config.js
@@ -3,5 +3,6 @@ const prod = process.env.NODE_ENV === 'production'
 module.exports = {
   'process.env.BACKEND_URL': prod
     ? 'https://api.example.com'
-    : 'https://localhost:8080'
+    : 'https://localhost:8080',
+  'process.env.VARIABLE_EXAMPLE': process.env.VARIABLE_EXAMPLE
 }
diff --git a/examples/with-universal-configuration/package.json b/examples/with-universal-configuration-build-time/package.json
similarity index 100%
rename from examples/with-universal-configuration/package.json
rename to examples/with-universal-configuration-build-time/package.json
diff --git a/examples/with-universal-configuration-build-time/pages/index.js b/examples/with-universal-configuration-build-time/pages/index.js
new file mode 100644
index 00000000..86a0eacd
--- /dev/null
+++ b/examples/with-universal-configuration-build-time/pages/index.js
@@ -0,0 +1,6 @@
+export default () => (
+  <div>
+    <p>Environment variable process.env.VARIABLE_EXAMPLE is "{process.env.VARIABLE_EXAMPLE}"</p>
+    <p>Custom environment variables process.env.BACKEND_URL is "{process.env.BACKEND_URL}"</p>
+  </div>
+)
diff --git a/examples/with-universal-configuration/pages/index.js b/examples/with-universal-configuration/pages/index.js
deleted file mode 100644
index 3bafc6a8..00000000
--- a/examples/with-universal-configuration/pages/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export default () => <div>Loading data from {process.env.BACKEND_URL}</div>