Help Center
< All Topics
Print

Introduction

We now have a page on the Speakeasy web site (http://speakeasy-aphasia.org.uk/aphasia-image-shopper/) that allows users to request to purchase  aphasia-friendly images. This document describes how this page was created and how the process works.

Instructions

How it Works

A user can complete a form which allows them to select from a wide variety of watermarked aphasia-friendly images. The user should pick the images they wish to have unwatermarked copies of, complete some contact details and submit the form. The form will then be emailed to the Speakeasy Office mailbox.
When a member of administration staff receives the request, they reply with a cost and invite them to pay online via the donation button, asking that the purchaser mentions Image purchase in the reason for the donation.

Once a donation has been confirmed as received, the administrator can then select each of the corresponding unwatermarked images and create a zip file containing all of the files, then email it to the purchaser. (see image location details below).

Implementation Details

As mentioned earlier, images can be specified via the following web page:
The above page was created using WordPress, by following using the instructions in the article below:
The original images were developed by Speakeasy and Gill Pearl. However, uploading these to the web site is not practical because:
  • each image can be quite large so any web page containing all the images would take ages to load
  • the images are all different physical sizes which would lead to an uneven layout
  • providing the raw images means anyone can download without purchase/donation!
Therefore, each image, prior to uploading to the web site, needs to be processed as follows
  • a copy of the original image is made and a watermark applied
  • the image is converted to a thumbnail image , which significantly reduces its file size and gives each image the same physical dimensions to ensure a clean layout on the website.

Creating a Watermarked Image

Watermark images were created using the Visual Watermark app. This can be downloaded and installed in a user’s PC from the following location:

The software is very easy to use – simply select the original images and select an appropriate watermark. Specify the appropriate output folder where watermarked images should be stored – see info on image file locations given later in this document.

Converting a Watermarked Image to a Thumbnail Image

This was done using the Easy Thumbnails app. This can be downloaded and installed in a user’s PC from the following location:
The software is very easy to use – simply select the watermarked images from the appropriate folder and specify an output folder. See info on image file locations given later in this document. For consistency, the size of the thumbnail to 150×150 pixels

Image File Locations

  • The original images can be found in Teams (or File Explorer) at the following location:

    Bury Speakeasy\Speakeasy – General\CitrixContent\Artwork Stroke\artwork for CD

    Any new images should be added to this location before watermarking and creating a thumbnail.

  • Watermarked versions of the above images can be found here:

    Bury Speakeasy\Speakeasy – General\CitrixContent\Artwork Stroke\artwork for CD
    \Watermarked\

  • Watermarked thumbnail versions of the  images can be found here:
    Bury Speakeasy\Speakeasy – General\CitrixContent\Artwork Stroke\artwork for CD\Watermarked\WatermarkedThumbnails

    It is the files from this location that were uploaded to the web site. They were first added to the WordPress Media Gallery, then they can be selected as choices from the form designer – see the following article: https://jeroensormani.com/how-to-include-the-wordpress-media-selector-in-your-plugin

Captcha Control

The images page uses WPForms to request a user to select images that they may wish to purchase. To prevent spam from automated web “bots”,
the form includes a Captcha control which makes it far more difficult for robotic web crawler tools to complete web-based forms.
The Captcha control was setup by first creating a new Google account, then registering that account with Google ReCaptcha
to obtain two keys: a site key and a secret key. Both of these keys, along with the username and password for this google account, can be
found in Bitwarden – see the entry marked “Speakeasy Google Account e.g. for ReCaptcha”

Image Order Fulfilment

The following guidelines should still be used. However, it is anticipated that the watermarked images may be moved from the Speakeasy WordPress web site to the SumUp store. This will make it easier to charge a fixed price for each image or apply discounts for, say 10, 20, 50 and all images. Currently, a prospective customer will email and then we request a donation. Moving to SumUp will help formalise the purchase process.

When an order is received for images, first confirm that a suitable donation has been received. Assuming this was done via the web site, then login to GoFundMe using the details in BitWarden and download the most recent transactions as a CSV file. Open this file in Excel and try to identify the relevant donation – though this can be difficult if the donation was anonymous.
To fulfil the order, create a new folder somewhere on a local computer – NOT in a Teams folder. You could create one under your Downloads folder or on your desktop.
Open the email that lists each of the images requested. Navigate to Bury Speakeasy – General\CitrixContent\Artwork Stroke\artwork for CD. Use the name of each image listed in the email and select the corresponding unwatermarked image from the folder one by one, copying each to the new folder. If you are comfortanble selecting and delselecting multiple images, then this can be done in one go and all of them can be copied to the new folder in a single operation Compress the files into a single Zip file by right mouse-clicking on the new folder and and selecting “Send To….Compressed (zipped) folder”.

Sharing Files Via Teams Synced Folder

Copy the zip file to some folder in Teams, then follow the instructions in the following document: Sharing Teams Files with Users Outside Speakeasy

Sharing Files using JumpShare

Follow the instructions in the following document: Sharing Files using JumpShare