OS X Lion: How to Make Web Apps with Automator

Posted August 23, 2011 by Rob Rogers in Apple Mac

Instead of using third party applications to make web apps for your computer, you can use Lion’s Automator to create them. These can be desktop or iPhone versions of websites so you can use them for testing your site as well. By making them an application, these web apps will appear in Launchpad.

1. Open Automator.

2. Choose Application as the type for your document. Click the Choose button.

3. In the search box at the top of the application, input url.

4. Drag Get Specified URLs to the right pane.

5. In the new Get Specified URLs box in the right pane, double-click the apple.com url in the Address section and input the desired url you want to use for your web app.

6. Go back to the search box and input web.

7. Drag Website Popup to the right pane beneath the Get Specified URLs box.

8. Use the Site Size drop down to assign the size of the web app (Large, Medium, iPhone, iPhone (Landscape), iPad, iPad (Landscape) or Custom). Use the User agent to assign it to the Safari, iPhone or iPad versions of the site.

9. To see how your web app will look, go to the top of Automator and click the Run button in the upper-right corner.

10. Your web app will appear.

11. Close the web app by clicking the OK button.

12. If it is what you wanted, go to the menu, click File and select Save.

13. In the Save As box, input the desired name for your web app (keep the .app extension).

14. Click the Save button.

15. Open Launchpad and you will find your newly created web app.

You can change the icon for your newly created app by doing the following:
(special thanks to Fred Zelders!!)

1. Open an image you want to use as icon in Preview.

2. Hit Command+A followed by Command+C (the image is on the clipboard now).

3. Open Finder and locate the the web app you just created.

4. Invoke the Inspector with a Control+Click on the web app and chose Get Info from the contextual menu.

4. Click on the icon image (automator robot) in the left top hand corner.

5. Hit Command+V (clipboard content is pasted).

6. Close the Info window.

 

About Rob Rogers

Once a prolific author here on Tech-Recipes, Rob has moved on to greener pastures.
View more articles by Rob Rogers

The Conversation

Follow the reactions below and share your own thoughts.