Embed images and videos

Images can help to explain difficult concepts and can improve the aesthetics of your app, but they should be used carefully to ensure that they don’t just take up space without adding any benefit. In this case they will tend to make the final result less usable because users will need to scroll past them to get to the content that they do want to see. In many cases the best results can be achieved by simply ensuring that images are sharply focused and appropriately sized.


Inserting images

Using existing images

With these caveats in mind, the Open Justice app development environment makes it easy to embed both still images and video into students apps. To insert an image into a page, position the cursor at the point in the text where the image is to be inserted and click the “Add Media” button in the toolbar:

This will lead to the Media Library, where the desired image can be selected and inserted by first clicking on the image and then the “Insert into page” button in the lower-right:

Uploading new images

To upload a new image, click the “Upload Files” tab above the images, and in the page that follows either drag-and-drop files from your PC or click the “Add Files” button and select the images to upload to your media library. These will then appear in the library and can be chosen for display in any of your pages.


Aligning images and text

Images and text can be positioned relative to each other in a number of ways. For example they can flow linearly from top to bottom, or text can be placed to one side or the other of images. For simplicity it is recommended that text and images are aligned centrally, but you may wish to experiment with different layouts to see what works best for your app.

To choose the alignment mode, click on the relevant image to reveal the image toolbar, and then click on the required option (Align left, Align centre, Align right, No alignment, Edit):


Inserting videos

To insert a video from YouTube simply paste the text of the web address (URL) of the video into the page at the appropriate location. It is recommended that you use the MP4 file format for all videos since this is compatible with most mobile devices.