{"id":2844,"date":"2020-05-20T17:41:44","date_gmt":"2020-05-20T17:41:44","guid":{"rendered":"http:\/\/sites.la.utexas.edu\/kb\/?p=2844"},"modified":"2021-06-17T20:32:33","modified_gmt":"2021-06-17T20:32:33","slug":"2844","status":"publish","type":"post","link":"https:\/\/sites.la.utexas.edu\/kb\/2020\/05\/20\/2844\/","title":{"rendered":"Publication Design | How to Create Flashcards"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3515\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/06\/Basic-Training-Tag-V3.png\" alt=\"\" width=\"110\" height=\"25\" \/><\/p>\n<p><a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-2.01.19-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3525\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-2.01.19-PM.png\" alt=\"\" width=\"1222\" height=\"407\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-2.01.19-PM.png 1222w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-2.01.19-PM-300x100.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-2.01.19-PM-768x256.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-2.01.19-PM-1024x341.png 1024w\" sizes=\"auto, (max-width: 1222px) 100vw, 1222px\" \/><\/a><\/p>\n<h2>In this Photoshop training you will be designing a set of beautiful flash cards, you&#8217;ll sharpen your technical skills, and conceptual skills, such as:<\/h2>\n<ul>\n<li>familiarizing yourself with choosing copyright-free icons from the Noun Project that look consistent in line wight\/style &amp;\u00a0 that work best for your flash card set<\/li>\n<li>PSD layer cropping<\/li>\n<li>PSD layer organization<\/li>\n<li>PSD layer effects<\/li>\n<li>PSD layer exporting<\/li>\n<li>your skill in visual representation of abstract concepts<\/li>\n<li>using and appreciating alphabets from different cultures<\/li>\n<li>noticing how a set of images seen in succession &amp; that contain a mixture of symbols, icons and unfamiliar alphabets can convey a sense of poetry and emotion<\/li>\n<li>creating a MetaSlider in WordPress!<\/li>\n<\/ul>\n<p>Create 5 vocabulary flashcards in Photoshop, then create a slideshow in WordPress using these cards, which you will add to your STA Blog.<\/p>\n<p>Your Icons should visually represent, a mixture of abstract concepts and literal objects that work together to tell a sort of story that has impact.<\/p>\n<p>Example objects and concepts for a set of flash cards:<br \/>\n<span style=\"color: #ff0000;\">Brain (literal)<\/span><br \/>\n<span style=\"color: #ff0000;\">Heart (literal)<\/span><br \/>\n<span style=\"color: #ff0000;\">Respect (abstract)<\/span><br \/>\n<span style=\"color: #ff0000;\">Strength (abstract)<\/span><br \/>\n<span style=\"color: #ff0000;\">Struggle (abstract)<\/span><\/p>\n<p>View examples of flash card designs created by previous STAs:<\/p>\n<ul>\n<li>Object and concept oriented design: Tate Gibson&#8217;s Flashcards:\u00a0<a href=\"https:\/\/sta.laits.utexas.edu\/author\/atg729\/page\/13\/\">https:\/\/sta.laits.utexas.edu\/author\/atg729\/page\/13\/<\/a><\/li>\n<li>Object oriented design: Thuy H Nguyen&#8217;s Flashcards:\u00a0<a href=\"https:\/\/sta.laits.utexas.edu\/kb-psd-flashcard-training\/\">https:\/\/sta.laits.utexas.edu\/kb-psd-flashcard-training\/<\/a><\/li>\n<\/ul>\n<h1>Part 1: Design PSD Flashcards<\/h1>\n<ol>\n<li>Create a new Photoshop file with these specs:\n<ul>\n<li>780 x 300 px<\/li>\n<li>72 pixels\/inch resolution<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.48.15-AM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3133\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.48.15-AM.png\" alt=\"\" width=\"542\" height=\"392\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.48.15-AM.png 542w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.48.15-AM-300x217.png 300w\" sizes=\"auto, (max-width: 542px) 100vw, 542px\" \/><\/a><\/li>\n<\/ul>\n<\/li>\n<li>Get icons.\n<ul>\n<li>Go to\u00a0<a href=\"https:\/\/thenounproject.com\/\">https:\/\/thenounproject.com\/<\/a>. This will be your source of copyright-free icons. If you do not have an account on this site, go ahead and create a free one.<\/li>\n<li>Choose a theme for your flashcard (i.e. musical instruments). All of your icons should be revolving around this theme.<\/li>\n<li>Search for these icons. For each flashcard, you will have 3 icons representing each word. These 3 icons must be in different styles. For example, I chose these 3 styles for the single object &#8220;cello.&#8221;<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.59.27-AM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3135\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.59.27-AM.png\" alt=\"\" width=\"1383\" height=\"974\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.59.27-AM.png 1383w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.59.27-AM-300x211.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.59.27-AM-768x541.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-11.59.27-AM-1024x721.png 1024w\" sizes=\"auto, (max-width: 1383px) 100vw, 1383px\" \/><\/a><\/li>\n<li>Click on the icon that you want, then click &#8220;Get this icon.&#8221; Choose &#8220;Basic Download, &#8221; then click &#8220;Continue.&#8221;<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.02.25-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-3137\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.02.25-PM-300x210.png\" alt=\"\" width=\"300\" height=\"210\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.02.25-PM-300x210.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.02.25-PM-768x539.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.02.25-PM-1024x719.png 1024w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.02.25-PM.png 1381w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a> <a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.03.10-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-3138\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.03.10-PM-300x211.png\" alt=\"\" width=\"300\" height=\"211\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.03.10-PM-300x211.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.03.10-PM-768x541.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.03.10-PM-1024x722.png 1024w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.03.10-PM.png 1379w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/li>\n<li>Download the icon as a PNG.<\/li>\n<li>Do the same thing for all of the icons of your 5 objects. You should have a total of 15 icons at the end.<\/li>\n<\/ul>\n<\/li>\n<li>Choose background colors. You will need to choose bright, full-saturated colors.\n<ul>\n<li>Go to this site:\u00a0<a href=\"https:\/\/coolors.co\/\">https:\/\/coolors.co\/<\/a>\u00a0and click &#8220;Start the Generator.&#8221;<\/li>\n<li>Keep clicking the spacebar until you get all the colors that you like. If you see a color that you like, lock that color.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.12.12-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-3140\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.12.12-PM-118x300.png\" alt=\"\" width=\"118\" height=\"300\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.12.12-PM-118x300.png 118w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.12.12-PM-402x1024.png 402w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.12.12-PM.png 538w\" sizes=\"auto, (max-width: 118px) 100vw, 118px\" \/><\/a><\/li>\n<li>Copy the HEX codes for the colors by clicking on them. Use these HEX code as the background colors of your cards.<\/li>\n<\/ul>\n<\/li>\n<li>Go back to your Photoshop file. Make sure that you have the &#8220;Layers&#8221; panel visible on the screen. If it is not, go to Windows &gt; Layers.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.14.48-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3141\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.14.48-PM.png\" alt=\"\" width=\"310\" height=\"839\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.14.48-PM.png 310w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.14.48-PM-111x300.png 111w\" sizes=\"auto, (max-width: 310px) 100vw, 310px\" \/><\/a><\/li>\n<li>Each of your card will be a group, and they will overlay each other. On the &#8220;Layers&#8221; panel, create a new group. Name the group after the name of your object.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.14.11-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3144\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.14.11-PM.png\" alt=\"\" width=\"278\" height=\"494\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.14.11-PM.png 278w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.14.11-PM-169x300.png 169w\" sizes=\"auto, (max-width: 278px) 100vw, 278px\" \/><\/a> <a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.18.29-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3145\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.18.29-PM.png\" alt=\"\" width=\"278\" height=\"493\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.18.29-PM.png 278w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.18.29-PM-169x300.png 169w\" sizes=\"auto, (max-width: 278px) 100vw, 278px\" \/><\/a><\/li>\n<li>Color in the background. With the new layer selected, click on the &#8220;Rectangle Tool,&#8221; or use the shortcut U.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.22.16-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3146\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.22.16-PM.png\" alt=\"\" width=\"142\" height=\"145\" \/><\/a><\/li>\n<li>Draw a rectangle the cover the entire canvas. Change its color under the &#8220;Properties&#8221; panel. If you don&#8217;t have this panel visible, go to Windows &gt; Properties.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.24.41-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3147\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.24.41-PM.png\" alt=\"\" width=\"285\" height=\"375\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.24.41-PM.png 285w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.24.41-PM-228x300.png 228w\" sizes=\"auto, (max-width: 285px) 100vw, 285px\" \/><\/a> <a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.25.05-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3148\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.25.05-PM.png\" alt=\"\" width=\"308\" height=\"837\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.25.05-PM.png 308w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.25.05-PM-110x300.png 110w\" sizes=\"auto, (max-width: 308px) 100vw, 308px\" \/><\/a><\/li>\n<li>Bring in the icons you&#8217;ve downloaded by dragging the icon into Photoshop. Click on the &#8220;Rectangular Marquee Tool,&#8221; or use the shortcut M.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.33.56-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3150\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.33.56-PM.png\" alt=\"\" width=\"98\" height=\"160\" \/><\/a><\/li>\n<li>With the icon layer selected, drag the marquee so that it crops the icon nicely, eliminating the attribution text at the bottom. You will add these text in your blog later. Then Right-click &gt; Layer via Copy.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.38.25-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3152\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.38.25-PM.png\" alt=\"\" width=\"559\" height=\"597\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.38.25-PM.png 559w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.38.25-PM-281x300.png 281w\" sizes=\"auto, (max-width: 559px) 100vw, 559px\" \/><\/a> <a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.38.58-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3153\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.38.58-PM.png\" alt=\"\" width=\"519\" height=\"396\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.38.58-PM.png 519w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.38.58-PM-300x229.png 300w\" sizes=\"auto, (max-width: 519px) 100vw, 519px\" \/><\/a> <a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.41.37-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3154\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.41.37-PM.png\" alt=\"\" width=\"578\" height=\"658\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.41.37-PM.png 578w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.41.37-PM-264x300.png 264w\" sizes=\"auto, (max-width: 578px) 100vw, 578px\" \/><\/a><\/li>\n<li>You will see that the new layer created doesn&#8217;t have the attribution text. Hide the original layer by toggling its visibility.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.44.05-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3155\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.44.05-PM.png\" alt=\"\" width=\"275\" height=\"252\" \/><\/a><\/li>\n<li>Do the same thing for the other 2 remaining icons you downloaded for this object. Adjust the sizing of these icons to your liking.<\/li>\n<li>Next, you will align these icons evenly across from each other. Select all 3 of them, and click Layer &gt; Distribute &gt; Horizontal Centers.\u00a0<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.50.13-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3156\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.50.13-PM.png\" alt=\"\" width=\"656\" height=\"833\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.50.13-PM.png 656w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.50.13-PM-236x300.png 236w\" sizes=\"auto, (max-width: 656px) 100vw, 656px\" \/><\/a><\/li>\n<li>Add the name of your object in the language of your choice. I used Google Translate for this.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.00.45-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3160\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.00.45-PM.png\" alt=\"\" width=\"1082\" height=\"417\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.00.45-PM.png 1082w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.00.45-PM-300x116.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.00.45-PM-768x296.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.00.45-PM-1024x395.png 1024w\" sizes=\"auto, (max-width: 1082px) 100vw, 1082px\" \/><\/a><\/li>\n<li>Now it is your choice to choose how you want to layout your icons. Here are some examples. Feel free to choose another layout, if you&#8217;d prefer.\n<ul>\n<li>Center aligned<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/layout-example.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2845\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/layout-example.jpg\" alt=\"\" width=\"919\" height=\"537\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/layout-example.jpg 919w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/layout-example-300x175.jpg 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/layout-example-768x449.jpg 768w\" sizes=\"auto, (max-width: 919px) 100vw, 919px\" \/><\/a><\/li>\n<li>Top-left aligned<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.53.22-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3157\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.53.22-PM.png\" alt=\"\" width=\"916\" height=\"450\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.53.22-PM.png 916w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.53.22-PM-300x147.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.53.22-PM-768x377.png 768w\" sizes=\"auto, (max-width: 916px) 100vw, 916px\" \/><\/a><\/li>\n<\/ul>\n<\/li>\n<li>After you&#8217;ve decided on the layout you want, create guides for your future cards \/ icons. Click and drag from the horizontal ruler for horizontal guides, and vertical ruler for vertical guides. If the ruler is not visible to you, go to View &gt; Rulers.\u00a0<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.56.58-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3158\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.56.58-PM.png\" alt=\"\" width=\"315\" height=\"682\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.56.58-PM.png 315w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-12.56.58-PM-139x300.png 139w\" sizes=\"auto, (max-width: 315px) 100vw, 315px\" \/><\/a><\/li>\n<li>Your final guides should look something like this.\u00a0<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.02.18-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3161\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.02.18-PM.png\" alt=\"\" width=\"1153\" height=\"496\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.02.18-PM.png 1153w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.02.18-PM-300x129.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.02.18-PM-768x330.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.02.18-PM-1024x441.png 1024w\" sizes=\"auto, (max-width: 1153px) 100vw, 1153px\" \/><\/a><\/li>\n<li>Next, you will make the icons and text white. Select all of these layers and group them under one layer. Make sure that this group is nested within your card group.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.04.18-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3162\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.04.18-PM.png\" alt=\"\" width=\"280\" height=\"375\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.04.18-PM.png 280w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.04.18-PM-224x300.png 224w\" sizes=\"auto, (max-width: 280px) 100vw, 280px\" \/><\/a><\/li>\n<li>Double click on this group to open the &#8220;Layer Style&#8221; panel. Apply a &#8220;Color Overlay&#8221; of white onto these objects like this. Click &#8220;Ok.&#8221;<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.06.25-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3164\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.06.25-PM.png\" alt=\"\" width=\"779\" height=\"484\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.06.25-PM.png 779w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.06.25-PM-300x186.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.06.25-PM-768x477.png 768w\" sizes=\"auto, (max-width: 779px) 100vw, 779px\" \/><\/a><\/li>\n<li>You&#8217;re done with your first card! Now apply the same steps above to create 4 more cards. <strong>Each card should be in a different language!\u00a0<\/strong>You should have your layers organized like this in the end.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.10.01-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3165\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.10.01-PM.png\" alt=\"\" width=\"264\" height=\"130\" \/><\/a><\/li>\n<li>You will now export your card. Right-click on the card group &gt; Quick Export as PNG.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.11.08-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3167\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.11.08-PM.png\" alt=\"\" width=\"315\" height=\"828\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.11.08-PM.png 315w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.11.08-PM-114x300.png 114w\" sizes=\"auto, (max-width: 315px) 100vw, 315px\" \/><\/a><\/li>\n<li>Export all of your cards and you&#8217;re done for this section. Upload your cards to Basecamp for review and update your blog with your progress and experience \/ feedback.<\/li>\n<\/ol>\n<h1>Part 2: Create a MetaSlider in WordPress<\/h1>\n<ol>\n<li>Log in to your STA Blog WordPress account. On your left sidebar, click MetaSlider &gt; MetaSlider.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.13.53-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3170\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.13.53-PM.png\" alt=\"\" width=\"319\" height=\"465\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.13.53-PM.png 319w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.13.53-PM-206x300.png 206w\" sizes=\"auto, (max-width: 319px) 100vw, 319px\" \/><\/a><\/li>\n<li>Click &#8220;New Slideshow.&#8221;<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.15.05-PM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3171\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.15.05-PM.png\" alt=\"\" width=\"1567\" height=\"975\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.15.05-PM.png 1567w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.15.05-PM-300x187.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.15.05-PM-768x478.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-10-at-1.15.05-PM-1024x637.png 1024w\" sizes=\"auto, (max-width: 1567px) 100vw, 1567px\" \/><\/a><\/li>\n<li>Upload all of your card PNGs and select them, then click &#8220;Add to Slideshow.&#8221;<\/li>\n<li>When you&#8217;re done, scroll down. On the right side-bar, locate a card named &#8220;How to Use.&#8221; Copy the orange code snippet by clicking on it.\u00a0<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.10.56-AM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3493\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.10.56-AM.png\" alt=\"\" width=\"1863\" height=\"976\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.10.56-AM.png 1863w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.10.56-AM-300x157.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.10.56-AM-768x402.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.10.56-AM-1024x536.png 1024w\" sizes=\"auto, (max-width: 1863px) 100vw, 1863px\" \/><\/a><\/li>\n<li>Create a new blog post. In the body, paste the code you&#8217;ve copied.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.12.45-AM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3495\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.12.45-AM.png\" alt=\"\" width=\"1860\" height=\"975\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.12.45-AM.png 1860w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.12.45-AM-300x157.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.12.45-AM-768x403.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.12.45-AM-1024x537.png 1024w\" sizes=\"auto, (max-width: 1860px) 100vw, 1860px\" \/><\/a><\/li>\n<li>Lastly, input all of the credits for your logos into your blog post.<br \/>\n<a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.26.13-AM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3496\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.26.13-AM.png\" alt=\"\" width=\"394\" height=\"709\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.26.13-AM.png 394w, https:\/\/sites.la.utexas.edu\/kb\/files\/2020\/05\/Screen-Shot-2020-06-17-at-11.26.13-AM-167x300.png 167w\" sizes=\"auto, (max-width: 394px) 100vw, 394px\" \/><\/a><\/li>\n<\/ol>\n<p><a href=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2019\/02\/basic-training-last-steps.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3530\" src=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2019\/02\/basic-training-last-steps.png\" alt=\"\" width=\"3000\" height=\"1000\" srcset=\"https:\/\/sites.la.utexas.edu\/kb\/files\/2019\/02\/basic-training-last-steps.png 3000w, https:\/\/sites.la.utexas.edu\/kb\/files\/2019\/02\/basic-training-last-steps-300x100.png 300w, https:\/\/sites.la.utexas.edu\/kb\/files\/2019\/02\/basic-training-last-steps-768x256.png 768w, https:\/\/sites.la.utexas.edu\/kb\/files\/2019\/02\/basic-training-last-steps-1024x341.png 1024w\" sizes=\"auto, (max-width: 3000px) 100vw, 3000px\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In this Photoshop training you will be designing a set of beautiful flash cards, you&#8217;ll sharpen your technical skills, and conceptual skills, such as: familiarizing yourself with choosing copyright-free icons from the Noun Project that look consistent in line wight\/style &hellip; <a href=\"https:\/\/sites.la.utexas.edu\/kb\/2020\/05\/20\/2844\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":703,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"ngg_post_thumbnail":0,"footnotes":""},"categories":[200711,200717],"tags":[],"class_list":["post-2844","post","type-post","status-publish","format-standard","hentry","category-basic-trainings","category-photoshop"],"_links":{"self":[{"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/posts\/2844","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/users\/703"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/comments?post=2844"}],"version-history":[{"count":18,"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/posts\/2844\/revisions"}],"predecessor-version":[{"id":7167,"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/posts\/2844\/revisions\/7167"}],"wp:attachment":[{"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/media?parent=2844"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/categories?post=2844"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sites.la.utexas.edu\/kb\/wp-json\/wp\/v2\/tags?post=2844"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}