How to Create Mobile Apps as a Non-Developer

Justin | design,HTML5,iOS,tips | Wednesday, July 23rd, 2014

So you want to create a mobile app. Who doesn’t these days, right? But you’re not a hardcore programmer, and maybe your budget won’t allow you to hire one.

So how do you create an app for one or more of these platforms?

  • iOS
  • Android
  • Windows Phone
  • Blackberry
  • webOS

Each one of these operating systems uses a different programming language, and each one is reasonably complex.

Is There Some Universal Language I Can Use?

Short answer: yes. It’s HTML, the language of the web.

HTML can easily be packaged into a mobile app for many platforms. One way to package HTML into an app is using the PhoneGap code library.

PhoneGap Build

PhoneGap BuildbotIf the idea of a “code library” sends shivers down your spine, fret not, because there is a web service called PhoneGap Build. PhoneGap Build has a friendly user interface and does most of the work on the server translating your content into apps, so you don’t have worry about “compiling” or other such developer activities. And, it’s affordable!

Getting Started

Lynda.com has two courses in their video library featuring PhoneGap Build.

Up and Running with PhoneGap Build

Watch the Up and Running with PhoneGap Build course on Lynda >>

Creating an iPad App with HTML5 and PhoneGap Build

Watch the Creating an iPad App with HTML5 and PhoneGap Build course on Lynda >>

Don’t have a Lynda.com account? Get 7 days of free unlimited access.

The Best Part of Using HTML: You Don’t Have to Know HTML

You don’t have to know how to code HTML (or JavaScript, or CSS) to create HTML content. You can use a visual tool like Adobe Dreamweaver or Adobe InDesign in conjunction with our InDesign to HTML5 exporter.

Bonus Tip

If you’re looking for a way create an app for an Amazon Kindle Fire, you don’t even need PhoneGap Build. You can submit your HTML content directly to Amazon and they’ll do the packaging for you.

DropBox as a Web Server in 3 Easy Steps

Justin | tips | Wednesday, June 25th, 2014

So you’ve got some web content, now what do you do with it? Typically, this is where you’d upload your content to a web server.

Maybe you’re new to creating web content and the idea of signing up with a web host is daunting. Perhaps you’re dipping your toe in the water, and you don’t yet need your own domain name. You just need a place to post your files so that others can view them.

Fortunately, there’s a cheap (in most cases free) and easy solution. You can use Dropbox to host web sites.

Step 1: Copy your site into the Public folder within your Dropbox Directory

You may want to create a subfolder, so that you can house multiple sites in your Public folder.

dropbox_public

Important note: If your Dropbox account was created before Oct. 4, 2012, you will automatically have a Public folder. If your account is newer, you may have to request a public folder. (This may now require a paid account)

Step 2: Right-click and choose Copy Public Link

dropbox_copylink

You can create a shareable link from any Dropbox file or folder, but if your file has dependencies (images, CSS files, JavaScript files, etc) the Public folder has an easier time linking to those files.

Step 3: Paste the link in your browser to test, or paste into an email to send

dropbox_paste

You now have a link to your site. Here’s a sample site I created using in5.

Optional: You can use a link shortener to create a more memorable URL.

Strengths of Using Dropbox as a Web Server

  • Cheap/Free
  • Fast
  • Easy
  • Built-in version control
  • Doesn’t require an File Transfer Protocol (FTP) application. Files can be managed from the desktop.

Weaknesses of Using Dropbox as a Web Server

  • No server-side scripts
  • URL is generic

Helpful links

New to Dropbox? It’s a very useful service. Check out Keith Gilbert’s Up and Running with Dropbox course on Lynda.com to learn more about what you can do with Dropbox.

Need a Dropbox account? You can create one for free.

See also 4 Ways to Host Your Website on Dropbox.

in5 and InDesign CC 2014

Justin | extensions,HTML5,InDesign,tips | Monday, June 23rd, 2014

With the CC (2014) release of InDesign, Adobe has decided to rename InDesign to mark a new version and to archive the previous version of InDesign CC.

The InDesign team wrote a nice mechanism to copy preferences from the previous version of CC, which even copies extensions used in CC over to CC 2014.

Existing in5 users will notice that in5 appears in CC 2014 as a trial version, even if it had been licensed in CC.

Fortunately, you can still use the previous version of InDesign CC, and your activated license will remain intact. In some cases, you may need to reinstall in5 in CC, because of the transfer mechanism which moves/copies it to CC 2014. Alternatively, you can choose to activate a new seat of in5 within InDesign CC 2014.

We recognize that this is non-optimal and totally frustrating.

We’re investigating ways that our licensing might better mirror Adobe’s licensing and trying to figure out what might be best for our customers. You can provide feedback to us by answering the poll below.

How would you prefer to license in5?

View Results

Loading ... Loading ...

How to create a specific number of repeated characters without using a loop

Justin | tips | Wednesday, October 23rd, 2013

I’ve run into an issue on a few occasion where I wanted to dynamically create a string of repeated characters (usually spaces or tabs) an exact number of times. It always struck me as a bit of a headache to have to create a loop to join all the of the pieces of the string together.

Recently, I found a simpler way. The solution relies on the Array constructor. The Array constructor can accept either an array of values, or a number. If you pass a number, an array with that length is created with each item being empty. We can take advantage of the fact that the items are empty. Any character we use to join the array into a string is the only thing that will be shown, because the items themselves are empty.

var n = 3;
var str = '.';
var result = new Array(n+1).join(str); //creates "..."

Here’s what it looks like in a single line:

var result = new Array(4).join('.'); //creates "..."

(You need to add one since the join string appears between array items).

Far simpler and cleaner than creating a loop!

This code can be used in JavaScript or ActionScript.

Local Playback of YouTube Embeds

Justin | tips | Thursday, October 3rd, 2013

The easiest way to embed a YouTube video in another webpage is to use Share > Embed, found on any YouTube video page.

YouTube has recently made a slight modification to this code by removing the protocol (http:) at the beginning of the URL:

<iframe width="560" height="315" src="//www.youtube.com/embed/CBfVgQNKa5s" 
frameborder="0" allowfullscreen></iframe>

In many respects, this an improvement. The lack of a a protocol means that this link will inherit the protocol from its container page. So if the container page is https (a secure page), the YouTube video will be as well. This avoids a security warning to IE users when loading unsecured content (the http YouTube video)  within a secured (https) webpage. This is a more flexible method, as long as your page is on a web server.

However, it means that the embedded content will not preview locally from your hard drive.

To view a working embed from you local drive, modify the embed so that the src attribute begins with http:

<iframe width="560" height="315" src="http://www.youtube.com/embed/CBfVgQNKa5s" 
frameborder="0" allowfullscreen></iframe>

The same protocol policy goes for URLs used with Google’s Hosted Libraries (like jQuery).

Page 1 of 512345