Archive for the ‘Tutorial’ Category

Keeping Your Screenshots Organized With Deeper For Mac

Posted on: No Comments

As part of my daily workflow, it seems like I take hundreds of screenshots a day on my Mac. Whether it is to hurry and paste something into my design or save some inspirational web page. All those screenshots were filling up my desktop pretty quickly with image files.

This is what I did to help keep all those file at bay. I downloaded the application Deeper which is available for Mac. Deeper essentially enables the hidden preferences for your Apple computer.

deeper preferences

Deeper – General Tab

Once downloaded and installed—in the general tab there is a place to change the path for the computers screenshots. I just created a folder called Screenshots and directed the path to this new folder. I put the folder in the side bar of the finder window so its easily accessible.

Finder Sidebar

Finder Sidebar

That’s it. It is pretty simple. There are a bunch more hidden preferences you can change if you so desire. The only other one that I changed was for my dock position. If you there is something you do to keep your screenshots and other files organized, I would like to hear about them in the comments.

Download Deeper

Easily Copy and Paste Between Your Mac and iPhone

Posted on: 1 Comment

Have you ever wanted to copy a link or text from your Mac and send it to your iPhone? Or from your iPhone to your Mac? Probably. It is something that I want to do about once a week. Since downloading the Messages app (beta version) for my MacBook Pro—I have mostly been using it to do exactly that.

Messages app

Messages app

Just open the Messages app on your computer and send a message to your phone. You’ll get a text on your phone and if it is a link—just click on it to open the website. Its not exactly copy + paste but better than typing a really long URL.

Message iPhone app

Message iPhone app

Staying in full screen mode on the iPhone from page to page

Posted on: 32 Comments

It is incredibly easy to make any website capable of being saved as a full screen web app on the iPhone, iPad or iPod Touch. You may have come across a tutorial teaching you how to add a couple of meta tags in the head of your html and now you can save your website to your phone’s desktop and have it launch in full screen mode without the browser chrome.

The Problem

At this point, you are probably really excited to have added about 100 pixels of screen real-estate to your website. As you start to play around, you click on a link and what’s this? It switches from your full screen mode to Safari. You hurry and switch back to the full screen app and try it again. Once more, it opens the new page in Safari.

This is one thing that I had a hard time finding a solution to on the internet. How to keep your experience of the web app in the full screen mode without it trying to open every link in Safari.

Good news, I found some javascript that will fix this problem. Include this script below on every page of your site and it basically will grab all the anchor tags on the page and it handles the window location, which will load the new page and keep you in the full screen mode.

The Code

function fullscreen() {
	$('a').click(function() {
		if(!$(this).hasClass('noeffect')) {
			window.location = $(this).attr('href');
			return false;
		}
	});
}

fullscreen();

Notes

One thing to note about this method, is if you have a link that points to a file that you want the user to download, like a PDF, you should add the class ‘noeffect’ to the anchor tag to avoid problems.

If you visit the demo link on an iPhone or iPad and save it your homescreen. Launch it and click on the navigation links. You will see that it keeps you in the fullscreen mode.

Demo