|
|
| (8 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| − | Image Manipulation
| + | =Overview= |
| − | | + | Image editor application allows you to make basic changes to your picture file(s). Supported file formats are: jpg, jpeg, gif and png. |
| − | [[Category:Design]]
| |
| − | | |
| − | | |
| − | | |
| − | <br>
| |
| − | <font face="Times New Roman, serif"><font size="4" style="font-size: 16pt">'''Image Editor'''</font></font>
| |
| − | | |
| − | <font color="#000000"><font face="Times New Roman, serif"><font size="3"><font color="#000000"><span lang="en-US">Image
| |
| − | editor </span></font><font color="#000000"><span lang="en-US">application | |
| − | allows you to make basic changes to your picture file(s). Supported | |
| − | file formats are: jpg, jpeg, gif and png. </span></font></font></font></font> | |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">'''Choose image for manipulation'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Choose image directory from drop-down list</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Choose image file from drop-down list</font></font>
| |
| − | | |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">Chosen image file and its details will be displayed within the interface.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">In order to download and save a file on local PC, click Download button.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click Edit button to edit an image file.</font></font>
| |
| − | | |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">The Image Editor allows you to modify images you have uploaded or selected from the library. The Image Editor consists of the following:</font></font>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3"></font></font>
| |
| − | | |
| − | {| width="639" border="1" bordercolor="#000000" cellpadding="7" cellspacing="0"
| |
| − | |- valign="TOP"
| |
| − | | width="262" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Icon'''</font></font>
| |
| − | | |
| − | | width="347" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Description'''</font></font>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="262" |
| |
| | | | |
| | + | =Choose Image for Manipulation= |
| | + | #Choose image directory from drop-down list |
| | + | #Choose image file from drop-down list |
| | + | #Chosen image file and its details will be displayed within the interface. |
| | + | #In order to download and save a file on local PC, click Download button. |
| | + | #Click Edit button to edit an image file. |
| | | | |
| − | | width="347" |
| + | <br> The Image Editor allows you to modify images you have uploaded or selected from the library. The Image Editor consists of the following: |
| − | <font face="Times New Roman, serif"><font size="3">'''Tools:'''</font></font><font face="Times New Roman, serif"><font size="3">A tool bar that allows you to modify the image.</font></font> | |
| | | | |
| | <br> | | <br> |
| | | | |
| − | <font face="Times New Roman, serif"><font size="3">'''The following can be found under Tools:'''</font></font>
| + | [[Image:Untitledpic0.JPG]] |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">Crop, Resize, Rotate, Contrast, Brightness, Sharpness, Exposure, Red-eye Reduction, Effects,</font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">Flip,
| |
| − | </span></font></font><font face="Times New Roman, serif"><font size="3">Undo.</font></font>
| |
| | | | |
| − | |- valign="TOP"
| + | =An in-depth look at Image Editor Tools= |
| − | | width="262" |
| |
| | | | |
| − | | + | <br> '''[[Image:Untitledpic2.JPG]]''' |
| − | | width="347" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Image View :'''</font></font><font face="Times New Roman, serif"><font size="3"></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">A</span></font></font><font face="Times New Roman, serif"><font size="3">llows you to zoom in and out of the image.</font></font> | |
| | | | |
| | <br> | | <br> |
| | | | |
| − | |- valign="TOP"
| + | [[Image:Untitledpic3.JPG]] |
| − | | width="262" |
| |
| | | | |
| | + | [[Image:Untitledpic4.JPG]] |
| | | | |
| − | | width="347" |
| + | [[Image:Untitledpic6.JPG]] |
| − | <font face="Times New Roman, serif"><font size="3">'''Thumbnail (Original Image):'''</font></font><font face="Times New Roman, serif"><font size="3">Allows you to revert back to the original image.</font></font>
| |
| | | | |
| | <br> | | <br> |
| | | | |
| − | |- valign="TOP"
| + | 5. Once you have completed editing image, click Apply to accept changes or Cancel to discard. |
| − | | width="262" |
| |
| | | | |
| | + | =Upload Image= |
| | | | |
| − | | width="347" |
| + | <br> In order to activate the Upload Image functionality, click the '''Upload''' button. |
| − | <font face="Times New Roman, serif"><font size="3">'''History Bar:'''</font></font><font face="Times New Roman, serif"><font size="3">shows the past steps of the resulting image. You can return to a specific step by click on the thumbnail.</font></font> | |
| | | | |
| − | <br>
| + | #Select directory from the drop down menu on top of the page to upload image into. You can also choose to create a new directory. |
| | + | #In order to create a new directory, click '''Create Directory''' button. |
| | + | #Click '''Browse''' and choose image file to upload. |
| | + | #Click '''Upload''' to complete the operation or Cancel to discard changes. |
| | | | |
| − | |- valign="TOP"
| + | [[Category:Design]] |
| − | | width="262" |
| |
| − | | |
| − | | |
| − | | width="347" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Cancel & Apply'''</font></font>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">You must click “Apply,” if you wish to keep all modifications made to the image.</font></font>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">Click “Cancel,” if you wish to exist and dismiss all changes.</font></font>
| |
| − | | |
| − | <br>
| |
| − | | |
| − | |}
| |
| − | | |
| − | <br>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3"><u>'''An in-depth look at Image Editor Tools'''</u></font></font>
| |
| − | | |
| − | <br>
| |
| − | | |
| − | {| width="639" border="1" bordercolor="#000000" cellpadding="7" cellspacing="0"
| |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Icons'''</font></font>
| |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Descriptions'''</font></font>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Crop'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Crop” select the portion of the image you wish to keep.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Highlight the section you wish to crop by dragging your mouse over the desired portion of the image.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Crop,” to modify image.</font></font>
| |
| − | | |
| − | ##
| |
| − | <font face="Times New Roman, serif"><font size="3">If you do not wish to crop an image that has been highlighted, click on the image again.</font></font>
| |
| − | | |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Resize'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Resize,” to modify the size of the image.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">A screen will pop up allowing you to specify height and width of the image in pixels.</font></font>
| |
| − | | |
| − | ##
| |
| − | <font face="Times New Roman, serif"><font size="3">Check Preserve aspect ratio, to maintain the ratio of height and width of the image.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Apply,” to accept changes.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Close” to exit screen without accepting changes.</font></font>
| |
| − | | |
| − | | |
| − | <br>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Rotate'''</font></font>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">Click “Rotate,” to turn image counter clockwise.</font></font>
| |
| − | | |
| − | <br>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Contrast'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Contrast,” to either increase/decrease gradient of color within the image.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">You can change the contrast by selecting either the bar which will allow you to move from left (decrease, -100) to right (increase, 100).</font></font>
| |
| − | | |
| − | ##
| |
| − | <font face="Times New Roman, serif"><font size="3">Or you can specify the intensity of the gradient by entering a number into the text box (-100, 0 100)</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “X” to if you do not wish to make any modifications.</font></font>
| |
| − | | |
| − | | |
| − | <br>
| |
| − | | |
| − | <br>
| |
| − | | |
| − | <br>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Brightness'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Brightness,” to either increase/decrease the amount of light in color of the image</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">You can change the brightness by selecting either the bar which will allow you to move from left (decrease, -100) to right (increase, 100).</font></font>
| |
| − | | |
| − | ##
| |
| − | <font face="Times New Roman, serif"><font size="3">Or you can specify the intensity of the light by entering a number into the text box (-100, 0 100)</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “X” to if you do not wish to make any modifications.</font></font>
| |
| − | | |
| − | | |
| − | <br>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Sharpness'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Sharpness,” to either increase/decrease the density of the image.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">You can change the density by selecting either the bar which will allow you to move from left (decrease, -100) to right (increase, 100).</font></font>
| |
| − | | |
| − | ##
| |
| − | <font face="Times New Roman, serif"><font size="3">Or you can specify the density number into the text box (-100, 0 100)</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “X” to if you do not wish to make any modifications.</font></font>
| |
| − | | |
| − | | |
| − | <br>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Exposure'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Exposure,” to either increase/decrease the amount of light allowed in the image</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">You can change the degree of light in the image by selecting either the bar which will allow you to move from left (decrease, -100) to right (increase, 100).</font></font>
| |
| − | | |
| − | ##
| |
| − | <font face="Times New Roman, serif"><font size="3">Or you can specify the intensity of the exposure by entering a number into the text box (-100, 0 100)</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “X” to if you do not wish to make any modifications.</font></font>
| |
| − | | |
| − | | |
| − | <br>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Red-eye Removal'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Red-eye Removal,” to enable crop feature.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Highlight the section you wish to have red eye reduced; by dragging your mouse over the desired portion of the image.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Red-eye Removal,” to modify image.</font></font>
| |
| − | | |
| − | | |
| − | <br>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Effects'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Effects,” to select different color effects to be done to the image.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Select one of the following two options:</font></font>
| |
| − | | |
| − | ##
| |
| − | <font face="Times New Roman, serif"><font size="3">Grayscale</font></font>
| |
| − | | |
| − | ##
| |
| − | <font face="Times New Roman, serif"><font size="3">Sepia (Shades of brown, similar to grayscale)</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “X” to exit if you do not wish to make any modifications to effects.</font></font>
| |
| − | | |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Flip'''</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Click “Flip” to flip the image.</font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3">Select one of the following two options:</font></font>
| |
| − | | |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">a. Horizontal (flips the image horizontally)</font></font>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">b. Vertical (flips the image vertically)</font></font>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3"><span lang="en-US">3.
| |
| − | </span></font></font><font face="Times New Roman, serif"><font size="3">Click “X” to exit if you do not wish to make any modifications</font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">.</span></font></font>
| |
| − | | |
| − | |- valign="TOP"
| |
| − | | width="304" |
| |
| − | | |
| − | | |
| − | | width="305" |
| |
| − | <font face="Times New Roman, serif"><font size="3">'''Undo'''</font></font>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">This button allows you to retract the last step that was done. By clicking “Undo” twice, you will revert two steps back. The number of times “Undo” is selected will be equivalent to the number of steps reverted back. This is based on how many steps you have done.</font></font>
| |
| − | | |
| − | <br>
| |
| − | | |
| − | |}
| |
| − | | |
| − | <br>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3"><span lang="en-US">Once
| |
| − | you have completed editing image, click </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">'''Apply'''</span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">
| |
| − | to accept changes or </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">'''Cancel'''</span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">
| |
| − | to discard.</span></font></font>
| |
| − | | |
| − | | |
| − | <br>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3">'''Upload Image'''</font></font>
| |
| − | | |
| − | <font face="Times New Roman, serif"><font size="3"><span lang="en-US">In
| |
| − | order to activate </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">the
| |
| − | Upload Image functionality, click the </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">'''Upload
| |
| − | '''</span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">button.
| |
| − | </span></font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3"><span lang="en-US">Select
| |
| − | directory </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">from
| |
| − | the drop down menu on top of the page to upload image into. You can
| |
| − | also choose to create a new directory.</span></font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3"><span lang="en-US">In
| |
| − | order to create a new directory, click </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">'''Create
| |
| − | Directory'''</span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">
| |
| − | button.</span></font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3"><span lang="en-US">Click
| |
| − | </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">'''Browse'''</span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">
| |
| − | and choose image file to upload.</span></font></font>
| |
| − | | |
| − | #
| |
| − | <font face="Times New Roman, serif"><font size="3"><span lang="en-US">Click
| |
| − | </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">'''Upload'''</span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">
| |
| − | to complete the operation or </span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">'''Cancel'''</span></font></font><font face="Times New Roman, serif"><font size="3"><span lang="en-US">
| |
| − | to discard changes.</span></font></font>
| |
Image editor application allows you to make basic changes to your picture file(s). Supported file formats are: jpg, jpeg, gif and png.
5. Once you have completed editing image, click Apply to accept changes or Cancel to discard.
