Product Management UX/UI & Interacion Blog — Frank derFrankie Neulichedl

Finally a way to backup your Bitly (bitmarks) links

What I like most about Bitly is the option to use my own custom domain for shortening the urls. In my case I use I wanted to use my own domain because I thought that in the case that bitly goes out of business or whatever I can take my short urls and just move them to my own server  - but the problem is that bitly locks me in.

There is no official backup solution. At least now with IFTTT you can automatically create a backup while you are creating new bitmarks.

I've setup a quick recipe that appends new links to a textfile in dropbox - so go ahead and tinker with it to your liking and get a copy of your shortened links.

#bitly   #bitmarks   #ifttt   #recipe

Embedded Link

Use this ifttt Recipe: Backup Bitly to Dropbox Textfile Put the internet to work for you.

Google+: View post on Google+

A handy portable Instagram Filters Cheatsheet

I stumbled across these guide to Instagram Filters and while I liked it very much it lacked 2 things - a couple of filters and it's not handy while you take photos on the road. So I fired up my Indesign and made up a free quick cheatsheet to keep with you all the time. Just print it out at 100%, cut and fold it - it's credit card size. Available both as jpeg and pdf for your convenience.


Instagram Filters Cheatsheet - JPEG VERSION

Instagram Filters Cheatsheet - JPEG Click here to download [/one_half][one_half_last]

Instagram Filters Cheatsheet - PDF VERSION

Instagram Filters Cheatsheet - PDF Click here to download [/one_half_last]

Quickly search from the the Chrome URL field

One more feature to integrate to your and your clients websites. Opensearch.xml is a simple file that helps Chrome search directly the content of a website. So it saves you the step of going to that website and enter a search. So just try to enter in the url bar and hit space - and bam you can search directly my website.

Very neat and easy - Thanks to Jeremy Keith for this tip

Google+: View post on Google+

Translation Software used to be expensive, not anymore

Many firms operate internationally and need translations not just for their documents, but also for their apps, websites, documentation etc. New tools from Google and other small firms help small business for their basic translation needs. The trickiest part of translations are industry specific translations that a firm want to keep consistent. This is where Translation Memories come into place.

This software keeps track of the translations and automates the translation of recurring text paragraphs and words. Useful and expensive (talk about 100.000s of Dollars).

Not all firms want or can spend this kind of money. The tools from Google and services like can help here. They are not super easy to use and lack sometimes some functionality (Google for example doesn't support sharing the document through an URL, or updating a current file), but they are a great tool anyways because they have built in translation memories.

#localization #tool #Google #free

Reshared post from +Google Developers

Google Translator Toolkit now supports more formats.

Embedded Link

Localize your apps and content more easily – new formats in Translator Toolkit - Google Developers Blog

Google+: View post on Google+

Finally an easy way to get Kindle Format E-Books on your Android Tablet

I like it that e-book publishers offer their books in multiple formats. A Book Apart for example offers also the Kindle Format. Nice, but if you just used the Kindle Apps on iPhone and Android you had no way to use these files. Now you can - the updated Android App can access files you send to it via email (or the sent to Kindle App).

Great, I'm just wondering what took them so long.

#amazon #kindle #android #workflow

Embedded Link

Amazon's Kindle App For Android Gets Updated To Support Kindle Format 8, Cloud Backup Of Email-To-Kindle Files Amazon updated their Kindle app for Android today, bringing about two changes that add a significant amount of functionality to the app. Perhaps the most... by Liam Spradlin in Applications, News

Google+: View post on Google+

Use Git to update your customized Wordpress Themes safely

Using Git to manage Theme Versions in Wordpress is a little bit geeky, but can help you a lot if you customize off the shelf (premium or free) themes. As good as these themes are to get a wordpress site up and running quickly, they also need some tweaking. Preserving these tweaks is not as easy. How can you keep track of sometimes multiple files you modified? Why not use a version control system that helps merging code bases. It let's you test out your tweaks, giving you a quick way back if you break something and it's the best tool to merge your changes into an updated version of the theme. Git is such a solution and it's fairly easy to use, once you pass the first hurdle of grasping the concept.

Git (and Github, the web service where you can host your git repositories) are subject in books and many articles on the web, so I leave that part out. In this little step my step I assume that you have Git installed on the web-server you host your Wordpress installation and have command line (ssh) access.

Setting up a theme with Git

  1. Install new theme with Wordpress Install as usually with the management tools provided by Wordpress  
  2. Create a new repository on the web-server SSH into the /wp-content/themes/ and create a new repository git init                         // create new repository git add .                        // add all files in folder git commit -m "original version" // commit with comment  
  3. Get ready for future updates git branch ready4update          // add new branch This will create a branch in which we will then copy the updated theme files when we need to update
  4. Make your modification to the themeNow you can make your changes to the theme as you like - you will continue to make changes to the master branch. You need to commit your changes to register them with git and I highly advise to use the workflow approach described in ProGit to make your work even more efficient. To commit your changes just enter git add .                                // add all files in folder git commit -m "Insert your comment here" // commit with comment  

Update the theme

Now comes the neat part. You have an updated theme and you need to merge it with your customized one. To do this we need to activate the branch we prepared in step 4.

  1. Install new theme files git checkout ready4update     // go to branch

    Now copy the updated theme files into the folder and overwrite everything and commit the changes to the ready4update branch.

    git add .                     // add all files in folder git commit -m "updated theme" // commit with comment  

  2. Get Master branch ready We go back to our master branch and make a temporary branch to have a save update. git checkout master          // go to master branch git checkout -b tempupdate   // create new temporary branch from master and change to it  
  3. Merge the update into the temporary branch And now we merge the two branches git merge ready4update       // merge with tempupdate

    The trick here is that the master and ready4update branch have the original theme as common ancestor. Git can merge this way the changes made by the author of the theme and yours - and if you have conflicts git will help you resolve them.  

  4. Test the website Since we have created a tempupdate branch we are working in, even if something brakes badly you can still go back to your previous stable master branch (git checkout master).  
  5. Merge into master and get ready for next update If the test went well and your wordpress site works well you should get ready for the next update git checkout master         // go to master branch git merge tempupdate        // merge the branch into master git branch -d tempupdate    // delete temporary branch git branch -d ready4update  // delete ready4update branch git branch ready4update     // create new ready4update branch  

Now you are ready to update your theme or make additional changes to it. Believe me - it looks more complicated then it actually is, so go ahead and try it.

Indesign still not ready for right-to-left languages - yes and no

In this "globalized" world I find it remarkable that inDesign still today has problems with languages who require right to left writing. Even better is, that it actually can layout text for these languages, but it's not exposed. I found this Script which helps you if you need to access this functionality.

#script #indesign #arabic #hebrew #javascript

Embedded Link :: Right-to-left, Arabic, Hebrew, Hindi ... in InDesign CS4 (none-ME)

My name is Thomas Silkjær and I am currently living in beautiful Aarhus, Denmark, with my wife and daughter, while working as a professional graphic designer in a small design agency, specialized in b...

Google+: View post on Google+

Great interactive Tutorial about Google Maps

Google Maps is one of the best Web-Apps ever created. There might be discussions about the costs for website owners, but as a consumer it's a blessing. Most functionality like creating your own maps etc. on the other hand is not so obvious and this tutorial gives an easy overview on how to make Google Maps even more useful.

Embedded Link

Google Maps — Start here.

Google+: Reshared 1 times Google+: View post on Google+

Great Guide on how to migrate your Facebook Application Profile Page to a Facebook...

Great Guide on how to migrate your Facebook Application Profile Page to a Facebook PageFacebook is sometimes confusing, but they try to simplify. I and many others have setup a Facebook Application to integrate Services like Facebook Comments into their blog. This Applications had a on Profile page (looked like a Fan Page) and used these Pages instead of creating a separate one. These Application Profile Pages lacked some features and are now deprecated by the end of the Month.

So hurry up if you want to preserve your "Likes" and Vanity URL and migrate now.

#Facebook #Application #Migration

Embedded Link

Migrating an SFC Application to a Fan Page Still getting emails about this one, so here's a quick rundown on how to do it. First, if you were already using a Fan Page, then you are not affected at all and don't have to do anything. Please stop...

Google+: View post on Google+

Link your website to your brand new Google+ Page

Easy as usual and now that just a couple of hours after the announcement everyone can create pages you might also link your website to this page. The icon used for the badge is actually not the black Google+ Icon we are used to now, but a red one - black for people and red for pages?

Now this is more than just a badge to put on your homepage next to Facebook and Twitter, but the tool also provides a link to put in your HTML Header to identify the website as a publisher and link it to that page.

I assume this will be used for display in search results on Google like it is done now for selected authors. I also am curious to see if there will be conflicts between author tags and publisher tags ... maybe both will be shown.

But the opportunity to het immediate followers on search results is great and makes sense.

#googleplus #design #microformat #link #pages

Embedded Link

Link your Google+ page to your site - Google+ Platform — Google Developers Google+ Platform. Overview; Plugins. +1 Button. Configuration Tool. Badge. Configuration Tool. Hangouts. Writing Apps; Running Apps; API Reference; Release Notes. API. People. get; search; listByActiv...

Google+: View post on Google+

Amazing professional After Effects, Avid and Final Cut Ori importing/exporting tools...

Amazing professional After Effects, Avid and Final Cut Ori importing/exporting tools now freeSince Automatic Duck and Adobe has teamed up they are no longer developing their import filters, but at least you can get them now for free :D

#video #editing #avid #aftereffects #finalcut #download #free

Embedded Link

Automatic Duck, Inc.

As many of you know I used to be a professional Avid editor, often working between Media Composer and After Effects before the cool kids were doing it. By 1999 I had grown tired of the tedious timelin...

Google+: View post on Google+

Donwload Section for Mobile Sites? - 5 Tips for a better User Experience

It's good practice to have a dedicated download section if a website is for a business that provides a lot of technical information for download. Especially B2B websites use the websites as a resource for providing access to brochures, drawings, etc. But in this mobile first times even B2B sites get accessed by mobile devices and downloading a file to that device is not always the best experience. Here are 5 tips for a better User Experience

1) Include a "Send Brochure to Email" Button I often find information I want to read later when I'm at my computer - the ability to send it to my email account is an easy way to remember me to read it and I know where i can find the brochure - in the email.

2) Provide links to PDF-readers Adobe has extended it's free Acrobat Reader series to mobile devices, but unlike the desktops not all smart phones users have installed them. It's much like a years ago where every website had a link to the download section of Adobe Acrobat - just now the links are for the app stores. Here are the links to the current versions: - Adobe Reader for Android - Access PDF files on the go: - Adobe Reader X for iOS - Access PDF files on the go:

3) Use a third party service like Isuuu I used Isuuu on many websites. Mostly where the business had a publication or catalog they wanted to make readable on the web without transferring all the content to the website. The causes might be workflow related or just because it was just cheaper.

Issue has redesigned it's online reading experience beyond their flash player to HTML5 and makes it accessible this way to mobile devices and tablets.

4) Give an alternative URL If the brochures just are other versions of the content already present on the website you might just publish a link and a note to direct them to that page.

5) Don't get rid of the download section If none of the above solutions work for you don't just get rid of the section. Visitors might know your site from the desktop version and expect to find the download section. Just have the section with some copy stating that you don't provide downloads in the mobile version with a link to the full website. I people really want to get to the downloads they can reach it.

This are just a couple of examples and it would be great to hear other ideas - what are your solutions? #UX #mobile #webdesign

Google+: View post on Google+

Custom Report for Google Analytics to see impact of encrypted searches

Looking at the Keywords of your site statistics are one of the first things web designers/owners do to see, what people are looking for on the site. The latest changes in Google's Policy to encrypt searches will impact this key measure - but how much?

Check out this cool tutorial on how to see the impact or just click directly on the link of the custom report and add it to your Google Analytics Account.

#Analytics #Encryption #Google #SEO

Reshared post from +Avinash Kaushik

Estimate the impact of recent Google http > https change for logged in users on your search keywords.

Step 1. Open Google Analytics (or any tool you have access to).

Step 2: Go to Traffic Source > Sources > Search > Organic

Step 3: Change the Date Range (top right) to Oct 19th - Oct 20th (yes real time! :).

Step 4: Look for a keyword called: (not provided)

Step 5: Compare the total Visits (in the scorecard under the word Explorer on top) with the Visits you see in the row called (not provided).

Step 6: Use your own data, rather than FUD to: A. Worry a lot. B. Not worry at all. C. Wonder if you are suddenly hungry.

Screenshot for my blog attached.

#datadrivenfreakingout :)

PS: You should be able to do this with every web analytics tools including the main ones like Omniture, WebTrends, Yahoo! Web Analytics, CoreMetrics, Baidu Analytics et al.

PPS: Inspired by Thomas's comment below I've created a special custom report in Google Analytics that you can use to keep track of the impact of this change over time. Log into Google Analytics first, then click on this link to download the report: .

Google+: View post on Google+

Designing for Emotion & Mobile First Books are out

A Book Apart, the excellent publishing company started by +Jeffrey Zeldman has published 2 new books today. They are inexpensive and always a great read - and for the first time also available as a bundle. This books are also a great read not only for designers and developers, but also for project managers and clients who want to understand what all the fuzz is about the latest trends in web design is ... they might skip the technical parts but grasp a broad view what to expect and what not.

#book #abookapart #epub #design #suggestion

Embedded Link

A Book Apart, Designing for Emotion & Mobile First Bundle Designing for Emotion & Mobile First Bundle. Designing for Emotion & Mobile First Bundle Designing for Emotion. View more images. Paperback bundle $30.00 + shipping + Add. ebook bundle $15.00 ...

Google+: View post on Google+

How to Add Google Plus sharing to Google Reader

I would love to see the Send To button also in the mobile version of the website and the app ... Reshared post from +Seyhun Akyürek

How To Share Google Reader Stories to Google Plus. You can share content with any circles. Cool tip. #google+

Embedded Link

How To Share Google Reader Stories to Google Plus Those of us who are still playing with Google Plus are eagerly awaiting its further integration into other Google services (in ways other than the red box in the top right corner). The updates are com...

Google+: View post on Google+