Protyposis

Travelling through time & space in real-time...

LAIS.Foto is a voluntary project that I developed a few months ago for a friend. It is basically a self-hosted online photo sharing platform with community features, similar to Flickr. Compared to other existing platforms, it features a unique upload and download workflow with an intermediate moderation step, tailored to the principle of donating and requesting pictures.

Requirements

The story began when the client asked me for my opinion on how she could build and manage a photo sharing platform with one of these online website generators provided by webhosting companies. The idea was to create a picture sharing website called LAIS.Foto, where people could donate (upload) pictures for charity and nonprofit projects that cannot or do not want to afford paid pictures for their promotion work. Members of these projects would then request and acquire (download) pictures that they want to use.

The website would contain a gallery of available pictures, managed by my client. The workflow from picture donation to acquisition would be like this: a donor would send his pictures to my client by mail. She would then pick the pictures that she deems suitable for the website, manually resize them and add a watermark so they could be added to the website’s gallery. The small size and watermark would make it very hard for visitors to copy and use the pictures without permission. Interested parties would then visit the website, browse the gallery, select pictures that they wanted to use and send a mail to my client, asking for permission to use the pictures. My client would then decide if the requesting party fits the idea and requirements, and send them the original picture files by mail. Putting the files directly onto the website for download would be too risky because these website generators do not offer a way to restrict and control downloads.

This sounds very simple, but from a developer’s perspective it is overly complicated and most of it can be automated. Specifically the following things seemed problematic:

  • Sending and receiving pictures by mail. This will unnecessarily clog all involved mailboxes with unnecessary copies of huge picture files and waste lots of storage space, which is obscure to average users. Different mail size limitations of different mailbox providers will lead to transfer problems that are also incomprehensible for average users, and will require splitting files into multiple mails.
  • Downsizing and watermarking pictures, uploading them to the web space and adding them to the gallery is a lot of work that will get annoying. Resizing and watermarking can be semi-automated with batch processing (e.g. in Photoshop), but the files still need to be managed.
  • Requiring donors to send pictures by mail is complicated and not at all user friendly and might make them think twice about it.
  • Requiring users to request pictures by mail is again complicated and user unfriendly and surely not a way to motivate visitors to use these pictures. There are a thousand ways how users might communicate which pictures they want, and the corresponding files need to be looked up and sent by mail, which is a tedious task.
  • Donations and requests need to be managed manually, to keep track of who donated what and who requested which picture for which purpose.
  • Managing the gallery manually also means that it cannot be dynamically browsed or filtered.
  • The website would probably look and feel amateurish which again does not necessarily attract users.

Summed up, most of the work required to run this website would have to be done manually, and outside the actual website. The website itself would only be a tiny presentational part of the whole system, serving solely as a catalog. I couldn’t account for such a complicated project to exist and thus offered the client to develop a system that would automate all workflows as much as possible and provide additional enhanced and helpful functionality. A few months earlier I was searching for a decent self-hosted photo platform and could not find any, which posed an additional challenge to build one on my own. This is how it happened that I spared 4 months of my time for a project that I didn’t earn a cent from.

The basic requirements of the system can be summarized to the following: Picture gallery, user management, picture uploading with thumbnail generation and watermarking, picture download with permission management.

Existing Products

I’m a guy that likes to build things on his own instead of making compromises with existing solutions or spending a similar amount of time on understanding and customizing an existing system. Still, there’s incredibly much open source software out there and checking related work is every researcher’s duty. First, why not use an existing online platform like Flickr or Google+? These platforms have been developed since a long time and feature very elaborate picture gallery functionality, but picture donations and requests would still have to be managed manually or by an additional external software. The main problem however are licensing issues and complicated intellectual property right terms that I want to avoid by self-hosting. As an alternative, there are many self-hosted gallery scripts available. Examples are UberGalleryTinyWebGalleryPloggerCopperminePhonoraphTagrPhotoShowGallery, and phpAlbum. All of them offer gallery functionality, some have upload forms and some even provide user management. What all of them also have in common is their (sometimes extremely) outdated look and feel, and development of the last two has ceased a while ago. This leaves us with the three most promising candidates: Piwigo, a platform with lots of already existing functionality that can even be extended through plugins. Unfortunately, all of the available themes look extremely outdated and are therefore not a great basis to work with. Then there is Zenphoto, another platform with plenty of functionality, theme and extension support. Again, it massively lacks in the UI/UX compartment and doesn’t feel “Zen” to me. Finally there is Lychee, with a basic but modern UI, but lacking multi-user functionality.

Implementation

The platform is based on Bootstrap on the client side and Laravel with some 3rd party plugins on PHP 7.0 on the server side. Aside from the picture files, all data is stored in a MySQL/MariaDB database. Laravel turned out to be a great framework and a pleasure to develop with. Adding feature after feature made my initial estimate of “a basic version in a week” grow to four months of full-time development and resulted in a full-grown photo platform with lots of great features:

  • Multi-user support with permission management. Users can register for an account, upload their own pictures, create albums, pick favorites, and vote. Uploaders get their uploaded pictures credited to themselves of course.
  • Picture gallery in a nice grid layout without any whitespaces. Sorting by criteria, filtering by color, and browsing by categories and tags.
  • Voting. Pictures can be voted by certain moods.
  • Galleries. Users can create galleries to group pictures into collections.
  • Picture view with all kinds of associated data and metadata, EXIF picture data, full screen view, and gallery navigation.
  • Upload form. Multiple pictures can be easily dragged into the form and added to the upload queue. While pictures are uploading, users can already assign titles, descriptions, categories and tags. Autosave functionality that regularly saves the state of the upload. No more lost time and effort when you unintentionally close the browser or the internet connection drops out. Uploads can even be resumed on another device.
  • Upload moderation. Uploads of users enter a moderation queue and need to be accepted or dismissed by a moderator. This way, a quality check can take place and inappropriate pictures can be sorted out.
  • Thumbnail generation. On-demand thumbnail generation of various picture sizes and aspect ratios.
  • Picture content analysis. Basic color analysis with automatically generated tags. Pictures can be filtered by color and color combinations.
  • Download requests. Registered users and unregistered visitors can request pictures for download. A moderator processes the requests and decides if a request gets approved or rejected. If a request is approved, the users receives a personal download link for the picture that is valid for 7 days. Download logging to track usage and detect abuse.
  • Different download formats. Pictures can be downloaded in various sizes/resolutions, optionally with embedded credits for posting in social networks. The original file can be downloaded as well.
  • Fulltext search with Lucene.
  • Picture processing with GD or ImageMagick.
  • Email notifications. Moderators are automatically notified by mail if their attention is required, i.e. if a new upload needs to be moderated, or a download request decided. Uploaders receive a notification as soon as their upload has been moderated.
  • Static content with Markdown and YAML front matter support for static pages.
  • Admin area to manage users, galleries, categories, tags, download requests, and uploads.
  • Auditing. All user activity that modifies data in the system is logged in an activity log and can be used to track changes in the system.
  • Multilanguage. Support for German and English with auto detection.
  • Modern UI design with a responsive layout.
  • Tons of other functionality that make up the whole platform.

Conclusion

LAIS.Foto became a platform which not only fulfills the requirements identified in the beginning, but offers a lot of additional functionality. I knew from the beginning that I wanted to create a decent platform that could be of use for other people as well and therefore developed it as a “generic” software platform. LAIS.Foto is just an instance of this platform with a custom UI design and some custom functionality. The software is called Picturesque and will be available through getpicturesque.com.


There are no comments.

Leave a Reply