Category: Guide

Creating Documentation and Guidance

This brief guide discusses some of tips and tricks for creating successful documentation for systems, software, or processes.

I recently had the opportunity to create some guidance packages for the new FMS Workplace Reporting System and FMS Personal Tutoring Allocation Database, and I wanted to share my insights and experience of what creating documentation entails.

Develop Knowledge

The first step in the process is to gain knowledge of the ins and outs of the software, system, or process you are documenting. In my case this required a walk-through of the WRS and PTAS led by members of the respective development teams. But it could be through experiencing the process yourself and taking notes. You should have some confidence in the process or system prior to beginning documentation. Once I had a working knowledge of the systems and was given access to them, I was ready to begin.

Logical Order

The next step is to plan out the structure of the guidance. Determine what area or process should be discussed first, next, etc. It is useful to outline these steps in a Word document or on a scrap piece of paper. This structure should give your documentation natural flow. It is the flow that will make your documentation stand out as an easy-to-use guide.

Clear and Concise

Choose language that is clear and concise to detail the steps and processes covered in your documentation. There is no need to be overly descriptive, but at the same time you want to ensure that all the necessary detail is included. For example, if a button is a specific colour this detail could help users locate it. However, if all the buttons on the page are the same colour, there is no need to specify this information.

Process

Writing documentation is all about the process. And there may be several processes covered in a single guidance. So, it is important to compartmentalise these as much as possible to avoid overwhelming your user. Approach the project in parts. Provide an introduction, themes, and a summary. This will help the user understand what is being addressed and how to work through your process or system.

Images or Video

Including images and/or video in your documentation is a great way to make useful and helpful guidance. Images and video can do in a few seconds what paragraphs of text would take to explain. However, you should always make sure your images and videos are clear and consistent. Use the same software to generate images and video and make sure the quality is high. There is not much worse in the field of documentation than an image or video that is not high enough resolution to see what exactly is being described. Also, make sure your images show the specific item or area in context. This will help the user locate what they are looking for easily. Note however, that text should always accompany an image to facilitate use by visually or otherwise limited users. The combination of text and image makes for clear guidance.

Example screen shot showing a log in button

Annotations

Another great feature of images and video is that they can be annotated. Use software like PowerPoint to add arrows, circles, and even text to images. This will point out precisely what you are referring to in your guidance. You can use Adobe Animate or Camtasia to annotate videos. This increases the impact of a video or image.

Example annotated image

Exact Language

Using precise language is necessary in creating guidance. Identifying processes and functions is critical to the reader, so you need to be very specific about what you say. For example, if a button is in the top right corner of the screen, don’t say “at the top of the screen”. Tell your user exactly where to look. At the same time, if the user needs to drag an item, click on a button, or even scroll up or down the page – make that clear in your text. Both what to do, and when to do it. Use numbered lists when possible to make the order of a process transparent.

Repetition/Highlighting Important Bits

When a specific task is important it may be worth repeating or emphasising the related information. For example, if a user needs to press a save button one or more times in a process, you can emphasis this by repeating the instructions, using bold text (Note: using only coloured text disadvantages colourblind individuals), or setting the instructions apart in a box or larger text. Making the most important tasks hard to miss in your documentation is always a good idea. You can achieve this through a combination of repetition and emphasis.

Summary

The process of creating documentation or guidance for a system or process can be a really rewarding experience. You will get practice teaching by giving clear, concise instructions. You will have the opportunity to work with colleagues when learning about the process or system – or testing your work on someone unfamiliar with the system or process. Finally, you will develop a greater understanding of the system or process itself. I really enjoy creating documentation, and I hope if you get the opportunity to create guidance – large or small – in the future, you will take it.

Solved: Screen Sharing with Presenter View

I only have 1 screen, can I view my notes while sharing my screen?

Whether you are creating a pre-recorded presentation or delivering live on zoom/teams, having only one screen can be quite limiting.

Delivering my FMS TEL webinars in the office was easy with my two monitor set up but when working from home I struggled with only my laptop. I prefer to have notes to keep me on track and to make sure I cover everything I want to say. I knew there must be a way to access my notes while presenting.

Below are step by step instructions on how I shared my presentation with my audience while viewing my notes, all done using only a laptop!

powerpoint view, slideshow button highlighted
Open PowerPoint and start your slide show
view of show presenter view menu
Click the Ellipsis menu, then
“Show Presenter View”
Show taskbar button
Click “Show Taskbar” or press the Windows key on your keyboard
Open Zoom/Teams, Click “Share Screen”. You should see 3 options from PowerPoint,
choose PowerPoint Slide Show
To open Presenter View, navigate using the Alt + Tab buttons on your keyboard,
or press the windows key and select presenter view from the Task Bar

Tips

  • Practice the steps before your session (you may want to open this post on a second device so you can access the instructions while you practice)
  • Add a blank slide or holding slide at the start of your presentation, especially if your first slide contains animations or slide transitions
  • Add a finishing slide, when your presentation ends the screen will stop sharing automatically (Zoom will display a pop up message to confirm this has happened)

Faster Captioning

This post details some easy tips and tricks to speed up your caption editing process using Notepad and Word.

This post assumes users are using Panopto (ReCap), therefore Panopto guidance is linked for uploading and downloading caption files. Guidance for other products such as Streams, Vimeo and YouTube can be found on their own sites.

In FMS TEL many team members regularly work with captioning videos – whether these are our own instructional videos or webinars, or student learning materials. Recently a few of us in the team have been talking about how we caption videos – specifically, what processes we use. There are some of us in the team who use the inline caption editor in Panopto, and use speed controls to manage the flow of speech so they can correct as they go. Others prefer to download the caption files and work with them in a separate program.

Both methods have their pros and cons. Working within the online editor is often best for short videos, or those with very few corrections to be made. Sometimes, though, it is easier to manage longer or more error-prone caption files in their own window. This gives more space to see what you’re doing – as long as you can avoid messing up the file structure. You can also use proofing tools in Word to speed things along or cut out repeated mistakes.

The rest of this post details some tips you can try to speed up your own process if not using the online editor.

You may find that for the bulk of the editing you don’t even need to be listening to the video – the errors can sometimes be evident just from text.

To work with captions outside of Panopto, you’ll first need to download the caption file. If there is no file to download, you’ll need to request automatic captions first. The caption file can be opened in Notepad. From there, you can edit each line of text separately. You must not change the file structure – so do not edit any of the other lines in the file, even the empty ones.

The file repeats in structure every 4 lines. The first is the sequence number of the caption, the second is the timestamp displayed in hours, minutes, seconds and milliseconds, the third is the spoken text and the fourth is an empty line.

Then, save the Notepad file. In its folder, right-click the file, select ‘rename’ and edit the file extension to .vtt instead of .txt (you may need to change your folder settings to view file extensions first). Then, upload your caption file.

Deciding WHAT to edit is a whole separate issue, but once you’ve made those decisions, Word’s proofing tools can help you target certain things more efficiently.

If you want to take advantage of some more proofing tools, try copy and pasting your entire file into Word. This will allow you to use tools such as Spelling and Grammar check to remove duplicate words or transcribed stuttering sounds, and can also draw your attention to other oddities. The Spelling and Grammar tool automatically moves you through your document, saving time scrolling and searching. As well as checking spelling, this can also help trim unnecessary words from the text, making it faster to read.

Find and Replace is useful, and can help…

  • If a name has been consistently misspelled – for example Jo/Joe.
  • If the speaker has a filler word that can be removed (I say “kind of” as filler so always search for and remove it from the captions!).
  • To replace key numbers or years that have been spelled out with their numerical representations (e.g. ninety-nine percent -> 99%).
  • Filtering out inappropriate language if it has been misheard by the auto software – if you see it once you can search the whole document quickly.
  • Filtering out colloquial spellings (gonna -> going to).

A good tip to ensure you only find whole words is to search them with spaces before and after the word itself. You can also use the ‘more’ option dialog and check the ‘whole words only’ box.

These extra options can help speed things up.

If you have been deleting a lot of items and adding spaces in their place, you might also want to do a find and replace for two spaces together and replace with one space. Run this a few times until there are no results. Similarly, you could look for comma-space-comma if you have removed a lot of filler.

These steps won’t fix everything, but can cut out some of the bulk and help speed up your process. After using these tools, read through the captions carefully again to fix any leftover errors.

Embrace the silence: the use of timers in synchronous teaching

Learn how to use timers in your PowerPoint presentations to aid questions and answers for students and yourself.

As teachers or trainers we can often feel the pressure to fill the silence when presenting. How long should you wait for an answer? Or a better question might be, how long do you think you wait?

Research suggests that at least 3 seconds can provide positive outcomes for both teachers/trainers and students (Rowe, 1972).

Each task may require different lengths of silence, you will want to think about the time the students will need to:

  • process the question
  • think of the answer
  • formulate a response
  • (if teaching virtually) unmute or type their response

The concern is to provide the period of time that will most effectively assist nearly every student to complete the cognitive tasks needed in the particular situation.

Stahl, 1994

You may find yourself counting the 10 or 15 seconds in your head, but still the silence can feel unbearable.

PowerPoint Animations to the rescue

Using a consistent slide design with an animation will not only relieve the pressure on you to keep track of the time but also provide cues that students will become familiar with as your teaching progresses.

Below are examples and instructions for 4 different types of animations you can create in PowerPoint, ranging from super easy to slightly complex. At the bottom of this post you will find a template document of all the examples shown plus a few more complicated designs which you can download and use in your own presentations.

Example 1: Stopwatch

Example stopwatch PowerPoint animation
  1. Insert a circle and style as required (holding shift will help you draw a perfect circle)
  2. Add a “Wheel” animation to the circle and adjust to your chosen duration (max of 59 second)
  3. Add the stopwatch icon (Insert > Icons > search for “Stopwatch”)

Example 2: Progress Bar

Example progress bar PowerPoint animation
  1. Insert a rectangle, remove the outline and choose a fill colour
  2. Add a “Wipe” animation to the rectangle, using the effect options drop down change the direction to “From left” or “From right”. Adjust to your chosen duration (max of 59 seconds)
  3. Insert a second rectangle on top of the first, remove the fill colour and style the outline as desired.

Example 3: Count Down

Example count down PowerPoint animation
  1. Create a text box for each number required, style as required
  2. Add the “Disappear” animation to all text boxes
  3. Set the first number to start “on click” with a 1 second delay
  4. Set all other numbers to start “after previous” with a 1 second delay
  5. Stack each text box on top of each other in the correct order, you may want to use the arrange menu or the selection pane to assist with this
  6. (optional) Add a text box at the back stating times up

Example 4: Scrolling counter

Example scrolling counter PowerPoint animation
  1. Insert a rectangle, with no fill and an outline of your choice
  2. Insert a text box and type in the required numbers, with a new number on each line
  3. Add the “Lines” animation to the text box, move your text box so your first number aligns with the green arrow and your final number aligns with the red arrow (further guidance). Adjust to your chosen duration (max of 59 seconds)
  4. Insert more rectangles above and below the first rectangle you created to hide the numbers as they scroll in and out

Resources

Powerpoint Timer Template.pptDownload

References

Rowe, M., 1986. Wait Time: Slowing Down May Be A Way of Speeding Up!. Journal of Teacher Education, 37(1), pp.43-50

Stahl, Robert J. & ERIC Clearinghouse for Social Studies/Social Science Education.  1994,  Using “Think-Time” and “Wait-Time” Skillfully in the Classroom [microform] / Robert J. Stahl  Distributed by ERIC Clearinghouse [Washington, D.C.]  <https://eric.ed.gov/?id=ED370885>

Providing Live Feedback Using Office 365 Online

This short guide describes how to use the Reviewing tool in Microsoft 365 apps to dynamically collaborate on files.

Would you and your students benefit from the ability to have live, in-line feedback on essays, projects, and other work products? You can provide in-time feedback to students or colleagues as they work on individual or group work using Office 365 Share and Reviewing features. We’ve recently started using this method in our TEL Team to collaborate on documents.

To start the process, author simply need to share their file with the reviewer using the Share button in the file menu bar.

Share button in Word

This sends a link to the file to the reviewer. By clicking on the link, the file will be opened in Office 365 online. The file could be a Word document, PowerPoint presentation, or an Excel workbook.

To make revisions that display to other authors/contributors enter the Reviewing setting.

Reviewing setting drop down.

This will turn on your track changes that will then be displayed to other document authors. The other authors can see mark-up and accept or reject changes in-time or asynchronously as needed. Note, the editing and viewing must take place in the Online Word App. Using the desktop app to view the changes will not show track changes.

Side by side review and live track changes.

This can greatly benefit students as they work through their assignments, as well as give reviewers with the opportunity to provide input and suggestions as work products develop. It can also allow for dynamic collaboration between colleagues by allowing a “single” author control over accepting or rejecting edits by others.

An example of this could be a group of students working on a Word document together. One student could be in charge of the ‘final’ document while the other students make additions and changes at track changes. Thus increasing the transparency of editing. The coordinating author could then choose to accept or reject the input from their fellow students.

The unique power of live track changes provides authors with the opportunity to modify and edit their work as it develops rather than only at the point of submission or finalisation. This similarly benefits the reviewer as the option to review is not time constrained in the same manner as a submission for review may be.

Incorporating Pointing in Recorded Presentations – Motion tracking

This post shows how cursor movement can be used in online presentations to show gesture, and the skills needed to add motion tracked items to video.

As part of the recently launched Exploring 3D Anatomy MOOC, two video presentations were created. These presentations involved explaining diagrams and pictures. One of these recordings had a moving cursor which the presenter had used to explain various parts of the screen, and the other was recorded without a cursor. To improve the clarity of the explanations, we had a request to display a larger cursor over the recorded material, using it to ‘point’ to the various significant areas shown. 

When you’re planning a virtual presentation it’s worth checking if and how the software handles the cursor – some software will use a glowing highlight as you present, some will show and hide the cursor automatically depending on when you move it. The videos were recorded in ReCap, which automatically hides the cursor unless it is moving. The end of the post has links to various guides to help you choose your settings. The rest of this post details the animation process for how a larger cursor was added after the presentations had been recorded. This technique could be applied to other added graphical elements too if needed. 

Creating the New Cursor

As the cursor is used in a lot of animations, there was already a scalable vector graphic image of a cursor available to use. This had been drawn in Adobe Illustrator. The next step was to use After Effects to add the cursor to the video and animate it.  

Tracking the Cursor

For the video with the cursor visible, the motion tracking function of After Effects was used. After identifying the original cursor, the new larger cursor was set to track it. Here and there the original cursor changed colour to remain visible over different backgrounds. It wasn’t necessary to replicate the colour change with the larger cursor, but this colour change did add extra steps when setting up the motion tracking as it needed to be started afresh each time the original cursor had changed colour. For the video without the cursor, the process was simpler as there was nothing to hide or track. As such the animations could be set up from scratch. Based on the clear explanation from the presenter, it was possible to add a cursor to trace the areas being explained.  

Adding the New Cursor

The animations were set up to take place between certain moments of the video – like scenes. Key points in the video were identified and ‘key frames’ added which allow us to set up when certain animations should take place, and how long for. Simple animations such as changing size, position or rotation can be done relatively quickly using these linear key frames. 

Once the start and end points are set, further customisation can be done to change the feel of the animation. For example, in this case, the speed of the cursor should somewhat mimic a natural movement rather than a precisely uniform speed. Using ‘ease in’ and ‘ease out’ (combined as ‘easy ease’) allows for the animation to look a little more natural, and less jarring, as the cursor starts to move more slowly before speeding up and gradually slowing to a stop.  

When moving from point to point it’s very rare that a straight line is the best path to take, usually a slightly curved path can help add a more natural-looking movement. This might be used to instruct a viewer to click a series of buttons, for example. The ‘spatial interpolation’ in After Effects allows for the path of the moving object to be linear (a straight line) or Bezier (curved). The temporal interpolation tool allows for variations to the speed of the movement – a more customisable version of easing. Adjusting these allows for a nice natural pace and movement, and for more creative effects. For example an item moving from A to B may move slowly at first, then speed up towards the middle of its journey, then slow down again before arriving at its final destination – imagine a train travelling between stations!).

In this video the cursor was hidden from screen for most of the video so it was animated manually.
In this video the cursor was tracked (while visible), note the more erratic movement.

Approximating Gesture

The final videos allowed for a clear approximation of gesture to be added to the presentations, mimicking how a presenter might usually point to a screen or demonstrate a movement. While this is something very natural to do in person, you may need to think more about how you use and move your cursor in online presenting. Often it can be tricky to see the cursor, so you may wish to consider moving it more slowly than usual if you are using it to indicate processes or changes. Selecting some form of pointer or cursor highlighting in your chosen software can improve the visibility of the cursor during your presentation, whether recording or in person. On the other hand, you may wish to put your mouse out of reach so that random or accidental cursor movements don’t detract from your content. 

Motion Tracking Demonstration

This video demonstrates the full motion tracking procedure, showing how you can track an object and then map the position of a cursor to it.

Resources

I’ve got too much email!

This resource provides you with tips and tools for managing your email. Includes instructions and anecdotes on email management.

The FMS TEL team have developed a short course showing how you can make Outlook work for you. If your inbox is a chore and not a help, why not take a couple of minutes to tame the beast?

The short course is available on Canvas (also available in the MLE), and comes with an accompanying 9-minute audio programme which talks you through some examples of what the tools can be used to achieve.

The course is also available for you to import into your own courses via Canvas Commons, so feel free to use it!

But I haven’t got time!

  • 10 minutes – listen to the programme for food for thought, or do a quick spring clean
  • 20 minutes – click through the guides and listen to the programme, try some things out
  • 1 hour – give your inbox a good spring clean using our tips and guides, and implement some rules and filters to organise your incoming email
Feel your inbox stress just melt away

6 Steps to Spring Clean your Inbox

  • Look at what you’re receiving and who and where it is coming from.
  • Decide what is important or necessary, and what is less so
  • Unsubscribe from unimportant or useless notifications or services. Adjust your email notification settings in Teams and Canvas to reflect what you really want to be emailed about.
  • Try out categorising emails from certain people, projects or services.
  • Use folders or search folders to move things out of your main inbox using rules based on email features like the sender, or categories you set.
  • Review regularly and change your system to suit what fits your needs – if a folder or rule no longer serves you, change or delete it.

Resources

Cropping Video: Removing the date from Screencasts

Over the last year or so most of us will have taken the plunge and recorded a lecture or tutorial to share with students. You may be considering reusing this content for years to come, however the date and time on your screencast will give the game away.

I don’t know if some students would have a problem with a video from last year being used again this year… I would prefer the date (which is visible at the bottom left of my laptop screen) to not be visible

FMS Module Leader

We can do this with video editing software such as Adobe Premier Pro or Final Cut Pro, but what if you do not have access to such software?

At this point most of us usually head to Google to find a free alternative. Trying to find a free online tool can be a little daunting and it’s always worth double-checking the usage terms and privacy policies are reasonable.

We have previously recommended ezgif.com to be used to create animated gifs for instruction and demonstrations. Ezgif don’t store your files or claim any intellectual property rights over anything you upload, and your file is removed from their servers in an hour.

This free content editing website can be used for so much more than just creating gifs. They have a designated area for editing videos, including an easy to use cropping tool.

Digital Image File Formats, and When to Use them

Are you confident that you know when you should use a specific type of image format?

Within FMS teaching and research there is a great demand for clear and detailed images – this could be for purposes such as sharing diagnostic images or microscope views in high clarity, photographs of real cases and examples, or designing something eye-catching to promote your initiative. The detailed guide below explains the types of image formats you may find useful for different purposes.

There are several image formats that you are likely to come across, but what you may not know is that they can be separated into two ‘families’. This guide will help you understand the characteristics of each format, and which situation lends itself best to each.

Before we go into the details of each specific format, let’s talk about the two key families. These are VECTOR images and RASTER images, and while at certain sizes they could look almost exactly the same, their construction is fundamentally different.

Vector Images

Vector graphics are based on mathematical formulas that define geometric shapes such as polygons, lines, curves, circles and rectangles. Because vector graphics are composed of geometric constructions, they are best used to represent more structured images such as icons, line-art graphics and illustrations with flat uniform colours.

File extensions EPS, AI and SVG are examples of this type and are perfect for creating graphics that require frequent resizing such as logos and icons.

Vector-based images are much more versatile than raster-based images, with their most obvious advantage being that vector images are infinitely scalable. This means that the same image could be printed out the with the same clarity at both advertising billboard and postage stamp size. Another advantage is that as they are images that you create from scratch (as opposed to photographic images) they have a transparent background to them by default. If you need a white or coloured background in your file you can simply add a coloured box under your artwork.

Vectors do have a few limitations, such as not handling effects such as blurs, and poor handling of gradients.

Raster Images

Also known as Bitmap images, Raster images are composed of individually coloured square pixels which build up the complete image. As an example – all photographic images are captured as raster images, with TIF, JPG, PNG, and GIF all being examples of raster image file extensions.

Pixels have a defined proportion based on their resolution (high or low), and when the pixels are stretched to fill space they were not originally intended to fit, they become distorted, resulting in blurry or unclear images. When you resize raster images by scaling up you will be compromising their resolution, as a result, it is important to remember to save raster files at your required dimensions. Once you make a source image smaller than its original size there is no going back – unlike vector images!

This example demonstrates the different affects that scaling has on both a vector and raster image (logo). Notice how they both look fine at first, but then pixelation occurs.
A note about ‘Resolution’ and ‘Effective Resolution’

Image resolution for raster images is measured in DPI (dots per inch) and this refers to the density of pixels in an image. Websites display images at 72dpi which is a relatively low resolution. By contrast, images that will be used for printing are required to be no less than 300dpi at the size they will be printed.

You can’t just take an image and scale it up dramatically, as it would stretch out and lose quality, as the dots per inch would effectively have been lowered, i.e. the ‘effective resolution’ would be lower.

What is compression and why does it matter?

When you save an image, some files need to be ‘compressed’ to keep file sizes down, as the files themselves would be far too large if this didn’t happen. Some formats are ‘lossy’ and some are ‘lossless’. If image compression is lossy, this means that every time you make an amendment and save, you may lose some quality, sharpness or colour data. The quality of the image decreases in proportion to file size.

Here are details of some of the most common file types you’re likely to encounter:

Raster File Formats

1. JPEG – Joint Photographic Experts Group

JPEGs are an extremely common image file type and as a result they can be used both on websites and in most desktop applications. It is a lossy file format.

Your file may have either the .JPG or the .JPEG extension, don’t worry it’s exactly the same type of file, and the .JPG extension is the most commonly used.

Note: This type of image does not support an alpha channel, therefore can’t have a transparent background.

2. TIF (or TIFF) – Tagged Image File

Mainly used in the print industry, these files tend to be very large high-quality photographic images that feature “lossless compression” meaning the original image data is maintained regardless of how often you might copy, re-save, or compress the original file.

If you have access to Adobe Photoshop, then you have the ability to retain a layering structure within the file. This means that if you put a text layer at the top, you could then move that text around without being destructive to the layer below. The same is true for a native Photoshop file.

Note: Due to the low compression and high file sizes, this type of image should not be used online as it will take forever to load!

3. PNG – Portable Network Graphics

PNG’s are probably the second most common image type after JPGs. They offer lossless compression, so don’t lose quality when resaving or editing, resulting in a sharper image.

If you are preparing an image for a website then this format will probably be your best option as it allows for everything a JPG does but with a much sharper image. It can also handle transparency, enabling the use of a transparent background which is great for placing logos on to images, for example. These are not suitable for professional print purposes though, and are usually of a lower resolution for use online.

When saving these images in Photoshop you can choose between an 8 Bit, 16 Bit, or 32 Bit colour palette however this will be reflected in file size.

4. GIF – Graphics Interchange Format

There was a time when these and JPGs were pretty much the only image formats that you needed to know about however times have changed.

In their standard form GIFs are a pixelated image made up of a colour palette of up to 256 colours. Due to the limited number of colours, the file size is drastically reduced.

An example where these may be used could be some navigational icons on a site or app that require a quick load time.

The rise of social medial has contributed to the use of Animated GIFs, which are essentially a series of frames embedded within the GIF file. This can give an almost video like impression and typically only last a few seconds.

Vector File Formats

5. EPS – Encapsulated Postscript

An EPS file is a vector format that has been designed to produce high-resolution graphics for print. Almost any kind of design software can create/open an EPS.

The EPS extension is a universal file type that can be used to open vector-based artwork in almost any design editor, not just the more common Adobe products.

This safeguards file transfers to designers that may be using different software.

6. SVG – Scalable Vector Graphics

Although all vector graphics are scalable, the SVG file type is specifically named Scalable Vector Graphics because this format can be easily used online with newer technology and higher screen resolutions being introduced.

An SVG file would ensure that the quality of the image is not compromised no matter what device it is viewed on. This could be particularly appropriate for a logo or statistical chart. However, this image format is not intended for professional print purposes.

Note: SVGs can also be used in SVG animations.

7. AI – Adobe Illustrator Document

Adobe Illustrator is used for creating and editing images, rather than for sharing or uploading. Adobe Illustrator documents are the preferred vector graphics format used by designers for creating images for use in all types of projects from web to print.

Adobe Illustrator is the industry standard for creating vector artwork from scratch. It can also be used to export to pretty much any other file type.

Note: Think of these as being the “Source” file. Access to Adobe Creative Cloud is required to open this type of file.

It can be pretty complicated to fully understand the different image characteristics, much more so than it seems at first glance, but this brief guide has provided a better understanding of the standard file types and which are most appropriate for your project.

Conclusion

  • PNGs are very useful for most purposes – they are not lossy, and you can have a transparent background for easy integration to any document.
  • GIFs can be animated, and can also handle transparency.
  • Resolution is only relevant to raster images.
  • Vector images can be scaled up and down infinitely without loss of quality, which is great for logos, graphs and charts.

Basic Image Editing in Microsoft Photos

You may not have expensive software like Photoshop for image editing or you may just want to do a quick edit. There is a free option for basic editing in Windows 10. It’s called Photos.

If you’d like to find out how to do basic editing in Photos then check out this guide on the FMS TEL Community:

Canvas https://ncl.instructure.com/courses/30988/pages/basic-image-editing-in-microsoft-photos

MLE https://mle.ncl.ac.uk/cases/page/30511/