Adrien’s blog
Stuff I like, stuff I do, stuff I make

Tips & tricks, Technology, ThoughtsApril 30, 2009 4:08 pm

I think that, in our transition from hierarchical structures to folksonomies (tags) for indexing our stuff (e.g. videos, bookmarks, songs…), we might have forgotten something important: the control of visibility of our stuff. Let me explain my thought.

Let’s say you have a photo which is very personal and that you only show to very close friends and family only. Will you put it in your main photo album? Maybe not… Instead you would probably hide it in some secret place which is hard (or at least not obvious) to find (e.g. in an enveloppe inside your drawer, under your bed…).

Let’s move to the digital world, before the flickr and the web 2.0, we used to store our photo files in hierarchical structures: folders and sub-folders which most file systems rely on. This structure was efficient to organize your photos with a personal indexing scheme. For example you could decide to make one folder per event. For each event you would make one sub-folder per person who took the photos. This is a two-degree hierarchical structure. One characteristic of hierarchical file structures is that it’s easy to lose files, by not remembering where we had put it. This characteristic also applies to your appartment (or your bedroom) because it contains several objects (pieces of furniture) that can contain objects and so on… This makes it easy to hide stuff, and to make some stuff more visible (by not hiding them).

Now, by using tags (like on flickr, delicious, and other “web 2.0″ sharing platforms), we’re flattening our indexing structure, we cannot hide stuff inside other stuff. Instead, we just put sticky notes on a big mess of objects that have the same level of visibility. It’s like if we put all our photos on the ground, there is no furniture nor photo album to hide them.

Some intuitive way must exist for us to make our shared stuff more or less visible… For me, manipulating “privacy settings” is a brutal function for end users. Any thoughts?

Tips & tricks, Research, ThoughtsMarch 26, 2009 9:44 am

Today’s thought: How to keep the context of a URL shared by a contact when bookmarking this URL? By context, I mean: meta-information that describes why you might be interested by the shared URL, who sent it to you, when, and also gives you a way to reply/annotate/comment this sharing after consumption.

Confused? Okay, let me give an example use case (which happened to me this morning):

  1. A friend sends you an email saying “you must watch this amazing documentary, it gives constructive criticism of your research approach i think: http://youtube/giheughe, what would you reply to the question at minute 16.22?
  2. You already have several emails in your inbox with links to lengthy videos to watch. You would like to make some space in your inbox, but you don’t have time to watch these videos right now.

…and possible solutions to clear your inbox and keep a reference to URLs for later consumption:

  1. Solution 1 (no context): you “bookmark” these videos in a personal “todo-playlist” in order to watch them later. But if you do that, you lose the context of these shared URLs (i.e. for the definition of context, read above). Thus you don’t know in which mindset to watch the video and where to put feedback responding to your friend’s email.
  2. Solution 2 (webmail): if you use a good webmail (i.e. each email has its own URL, e.g. gmail.com), you can bookmark the email of your friend. This solution makes it possible to archive the email to make some space in your inbox, and to keep the context of shared URLs.
  3. Solution 3 (social-networking style): you bookmark the videos’ URLs in your “todo-playlist” (which you could also call “TV” btw), and, when you watch them, the user interface shows you the context of this shared video. E.g. the web page that embeds the video displays a frame with the name and photo/avatar of the friend who sent you this video, along with his recommendation message (e.g. the content of his email), and a link (or even a textbox) to respond. Wouldn’t that be nice? :-D
Tips & tricksMarch 23, 2009 12:56 pm

Hi all,
I just wanted to share with you one of my tricks for better organizing my bookmarks in delicious.
Today’s trick consist of using hashtags (e.g. #research) instead of regular tags when annotating/bookmarking web resources on delicious. Like twitter’s hashtags, they are not officially specifically handled/supported by delicious (yet?), but they are useful for me to make a difference between general/public tags and personal tags. Let me explain with a few examples:

  • I use the “research” tag for resources that deal with research in general. I use “#research” for resources that I keep for MY research
  • I use a “#todo” tag for stuff I need to read later. This shows that some tags can be irrelevant to other users but very practical for personal matters. Hashtags is a way to separate these two kind of tags.
  • Finally, I use a “#profiles” tag to list my profiles on the internet. A regular “profiles” tag would just not make sense to the community of delicious users.
Tips & tricksJanuary 28, 2009 10:02 am

Bonjour à tous,

Comme vous le savez, utiliser le même mot de passe sur plusieurs sites c’est pratique mais aussi extrêmement risqué dans des cas comme celui de monster.fr.

Pour éviter d’avoir à retenir un mot de passe par site, je vous propose deux solutions viables (j’utilise les deux couramment après y avoir murement réfléchi):

1) imaginez (et retenez) votre propre algorithme permettant de générer un mot de passe unique à partir d’un motif commun et d’éléments qui sont caractéristiques du site. Par exemple: 123[p]coco[n]![p] est la première lettre du nom de domaine du site et [n] le nombre de lettres du nom de domaine. => une fois l’algo retenu, il est facile de retrouver le mot de passe de chaque site

2) utilisez un bookmarklet pour générer un mot de passe unique pour chaque site à partir d’une clé maitre (mot de passe principal, éventuellement commun à tous les sites). Le site supergenpass.com propose un tel bookmarklet en javascript qui fonctionne sous firefox et IE, ainsi que sur les mobiles, et vous pouvez même télécharger le code source. L’avantage d’un tel système est que vos mots de passes seront vraiment uniques (hash) et que leur saisie sur les sites est presque automatique grâce au principe du bookmarklet.

Dans tous les cas, libres à vous (et je vous le recommande) de stocker tous vos mots de passe dans une base cryptée, au cas où vous auriez oublié votre algo perso, où un nom de domaine aurait changé, ou si le bookmarklet ne fonctionne pas. Pour ça je vous recommande KeePass, un logiciel libre qui a été porté sous Windows, Linux, J2ME, Windows mobile et plein d’autres plateformes. Ce qui garantit que vous pourrez retrouver vos mots de passe en toutes circonstances (sur la machine d’un ami, sur le pc verrouillé d’un cybercafé…)

PS: un dernier conseil pour éviter qu’on recoupe vos comptes sur plusieurs sites: utilisez une adresse email différente sur chaque site. Non, ce n’est pas une blague. Sachez par exemple qu’avec gmail il est possible de suffixer son nom avec un complément (ex: ajoly+monster@gmail.com renverra le courrier sur ajoly@gmail.com). Sinon, certains sites (comme endjunk.com) permettent de créer des adresses email de redirection à la volée (ex: monster@ajoly.endjunk.com). De cette manière il est aussi très facile de voir quel site vous envoie du spam :-)

Sortez couverts!

Tips & tricks, Scripts & programsApril 21, 2007 9:02 am

I won’t teach you that spam is a major problem these days. As soon as your email address is found on a web page, it is potentially exposed to spammers that can extract it automatically from HTML pages using robots. For that reason, many people cloak their email address:

  • by writing something like "john dot doe at gmail dot com" or even "john.doe(removethis)@gmail.com" in order to trick robots whereas humans can still understand the actual address.
  • by replacing its textual form with an image. That way, unless the robots use OCR, the email address can’t be extracted automatically from web pages.

Both methods have a downside: visitors can’t click the email address to send an email immediately if the email address is not textually included in the HTML page (as a "mailto" anchor link). Here, I propose a workaround that allows visitors to see and click your email address without exposing it in textual form on your HTML page.

The trick is to cloak your clickable email address in a flash object. If you even too paranoid to leave your email address in textual form in the flash file (which is binary and compressed), you can even put an image instead (this won’t be explained here, though). We will use SWF Tools to create the flash a file from an image containing your email address.

Step 1: Create an image representing your email address

Use your favorite "paint" program (I use "paint.net") to write your email address, crop the canvas (mine is 164x18), then save the image to a file (use png if you want optimal quality). Note that you may want to make the background of your image transparent, this will be supported in the resulting flash file.

Step 2: Create a script to generate the flash file

This time, you’ll need to create a file with your favorite plain text editing program (like notepad). Write (or copy-paste if you’re lazy) the following source code in the file:

# Generate a flash file cloaking an email link
# Run using Swftools http://www.quiss.org/swftools/
.flash bbox=164x18 version=5  name="emaillink.swf" compress
  .png button_img "emailmini.png"
  .button email_button
    .show button_img as=idle
    .show button_img as=area
    .show button_img as=hover
    .show button_img as=pressed
    # ActionScript
    .on_press:
    getURL("mailto:myemail@address.com", "");
    .end
  .end
  .put email_button pin=center x=82 y=9
.end

Now we’re going to do some replacements for the parts written in red. 164x18 are the dimensions of the image you created on step 1, and emailmini.png is its filename. Write your email address in the getUrl function. Then replace x=82 y=9 with the central coordinates of your image (in my case x=(164/2)=82 and y=(18/2)=9).

Save your file as "emaillink.sc", in the same directory as the image you created in step 1. 

Step 3: Run the script using SWFTools

First, you may need to download SWFTools freely from http://www.SWFTools.org then install it. Then run "swfc.exe" with "emaillink.sc" as an argument. Whatever the way you do (command line or drag&drop), make sure that the image file you’re referencing in your script can be found in the current directory.

This will result in a "emaillink.swf" flash file in the current directory. You can test it by drag&dropping it to a web browser.

Step 4: Embed the flash file in your html page

Embedding your cloaked email link into your html page consists in writing the following code: 

<object type="application/x-shockwave-flash" data="emaillink.swf" width="164" height="18">
  <param name="movie" value="emaillink.swf" />
  <param name="wmode" value="transparent" />
  <!–alternate content –>
  <img src="emaillink.png" alt="my e-mail address: myemail at address dot com"/>
</object> 

As for the script, you may need to replace some values here. emaillink.swf (appearing twice) is the name of your flash file, 164 and 18 are its dimensions. The img element defines an alternative, if the user’s environment is not able to display Flash content. If you want to keep it, you may need to put in the name of the image file you created on step 1 and a human-understandable textual representation of your email address (don’t write its normal form if you don’t want robots to extract it automatically by parsing your page).

Enjoy the result

This is how my cloaked email link looks:

my e-mail address: first name dot last name at gmail dot com

 

If it doesn’t show as a Flash object, check it out on my homepage instead.

Tips & tricks, NotesOctober 26, 2006 12:25 pm

Hi,

Today I decided to keep track of the programs that I use. In order to make this list versionnable and shared, I’ve made that list as a publicly-visible Wiki page.

Feel free to consult it there:

adrienjoly.schtuff.com - FavoriteSoftware

Tips & tricksSeptember 15, 2006 4:02 pm

Scribbling on a PDA is slow and the tiny on-screen keyboard is not handy… TenGO found an innovative way of typing! Check it out!

http://free.tengo.net/ 

Tips & tricksJune 28, 2006 7:54 am

Now that so many people have digital cameras, it’s sometimes frustrating not to be able to share pictures easily. One of the issues is the size of the pictures…

I’ve found a small program on the Internet that can resize your pictures automatically in one right-click! Then the quality is still good enough, but the size is drastically reduced! I’ve seen some pictures reduced from 2 MB to 200 KB without important quality loss!

Image Resizer 

Just go on this page and find the link to download "Image Resizer". Then you’ll just have to select your pictures, right-click, activate "image resizer", choose the final size (small, medium or large), click "OK" and the resized pictures are copied to the same folder!

Tips & tricksMay 11, 2006 2:45 pm

I quite obsessed about organizing my files in a precise and clear directory structure. This also applies for my tunes. But the directory structure is a tree, and a file is physically contained by one directory at a time (unless you use links, this is a feature of NTFS that is hidden in Windows, btw). emoticon For that reason, if you have a directory for each music genre, every song can only have ONE genre… Wouldn’t it be good to classify by "moods" instead of "genres", allowing a tune to be suitable for multiple moods? emoticon

After spending some time thinking about crazy ingenious solutions to make that possible (e.g. programming yet another music management program) emoticon, I finally realized that what I actually wanted to do was playlists! The only problem is that I want to "label my tunes with moods", like I do in Gmail; and editing a text file (i.e. the playlist) is not very convenient…

And guess what? The solution is both simple and elegant: use a music manager that allows playlist management by drag&dropemoticon I chose musikCube because it’s lightweight, efficient and free. I created a few "mood" playlists in the sidebar: fresh, sad, sunday morning, hardcore, and so on… Then I just drag&drop my tunes in the corresponding playlists. Finally, I can play any playlist after randomizing its order ("shuffle" can repeat some songs), according to my mood. Easy! emoticon Moreover, a great feature of musikCube is to move or copy the files contained in a playlist to another directory, making it possible to go back to a good old directory tree structure, usefull if a friend of yours like your "sad" tunes collection for example.