Search for Help
< All Topics
Print

Introduction

We now have a page on the Speakeasy web site (https://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 CDAny 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\WatermarkedThumbnailsIt 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”.

Instructions to be added when sending images to a purchaser

To ensure that sharing of images is not abused, the following text should be included in any email that contains unwatermarked images:

Other than embedding the images in Powerpoint or similar documents, we kindly request that you do not share the images more widely, as Speakeasy relies on the income these images generate in order to continue our work.

We also ask that you include an acknowledgement to Speakeasy each time they are embedded in PowerPoint slides or similar. Something like “images with thanks to speakeasy-aphasia.org.uk”
The income also ensures that we can continue to add to our list of images.

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

SumUp Store (not Live)

The SumUp store was initially setup to supersede the WordPress pages, as it provides a better means of obtaining payment before images are shipped to a purchaser. However, this is not live because images have already been placed on other websites for no charge as part of a prior arrangement, so we can’t officially charge for the images. The existing mechanism of people requesting images and Speakeasy asking for a donation will therefore continue.

The current WordPress mechanism relies on a user sending a donation via one of the donation web sites (e.g. JustGiving or EasyFundraising), whereas the SumUp site has the potential to take payment as soon as images are specified.

Adding Items to the SumUp Store

Login to the SumUp account – details can be found in BitWarden using the details with the title “Speakeasy SumUp account”.
Navigate to the “Items” page from the links on the left-hand side of the screen.
Click “Add item”, which appears towards the top right-hand side of the screen.
A screen will be shown, similar to that given below:

Click the “+” icon in the image link towards the top of this page. The following screen will appear:

Click the “+” icon in this screen and add the appropriate image from an image file stored in a folder – if this is a new aphasia-friendly image, make sure you add a watermarked image – see the “Creating a Watermarked Image” section above. Click “Save”.
Specify a price for the image, and set the “Tax rate” value to “No VAT”.
Add the item to a category – for images, this is typically the “Aphasia-friendly Images” category.
Make sure the “Display item in Online Store” setting is checked, else the new item won’t appear in the store.
Click the “Save” button”, then “Save and close”, or “Save and add another” if more images are being added to the store.

Bulk Orders

A means of setting up bulk orders was added to SumUp – this enables a user to pay a discounted price for a bulk quantity of images. See the SumUp store site for the two examples that exist.

Accessing the SumUp Using Speakeasy’s Domain Name

The SumUp store has its own SumUp-specific web site. It is preferable for the site to be accessed using Speakeasy’s own web domain address: speakeasy-aphasia.org.uk. Instructions for this can be found in SumUp documentation. This can be achieved by logging in to FastHosts (details in BitWarden) and adding a CName record to the DNS configuration of the speakeasy-aphasia.org.uk domain. The current CName configuration can be seen under the CName record with a host name of “onlinestore”. The store can be accessed via the following web address: https://speakeasy-aphasia.sumupstore.com. However, the store will be shown as closed as it is disabled, for reasons mention above.