Download - แผนการสอน
1. ����������
����ก�� PhotoShop �� Macromedia Flash ��������ก��� ������ก���ก�����ก�����������������ก����ก ���� �! "��#� $% �� ���&� '(�&�#�')ก���������*)�$�+ 2. �� ������ก����������
1. ����.����������ก�������"��/�
2. ����� ���������ก��������� 2. ����ก����������
- ก�� ���������ก���������� - ก�� ���������ก������
3. ก����ก���������� ����������������� !�
1. "���ก�� !���#��$%��&�' �()� www.piriyalai.ac.th 2. "���ก�� !����ก�*�+"�$�$%��&�'� )����,�ก����ก����������������ก��
���� 3. �,��,-����.' "���ก�� !�����$��"���,�ก,����� !�� ����$��ก�� !������
���������ก����������������ก��������� ���������/�ก����
4. ��ก�� !�01ก2�.$�����,�ก �.$������ ) 8 ��()�� ก��!���!�!*�+ �.$������ ) 9 ก�� ���������ก������
5. .���3/�$/3 ก��ก����������� ���� ��!4������ lan 6. "���ก�� !������� ����� ) 8, 9 7. �6� )��ก�� !��7/���/��� .��.�!���ก�ก���������� "�.������� .����1ก2�
�ก���ก�� !��!��� ก���/� 8. -����ก�� !�����6 3 D 4 .� "���ก���3/�$/3 ก��������.�/.+/�02 ��!
��(�ก���� )�������� �� "��+()�� 8 ��$�ก��$/+�ก!'
���ก�����ก�� �!"��#$%!& �'&()/+��, ก��������� ��ก��ก����ก
-�./"ก�� �!"��#$%!& 1
ก01.2+��,ก�� �!"��#$ ก�������� +����.����!
3�&/42)%!& 1-4 ��"/73� ���""ก�))���ก����ก
�8��/� 4 3�&/42)
�'&()
ก��������� ��ก��ก����ก 3./)3�9�%!& 4 3�9� 2.6
�����-� 9. .�� "����./� �����������+/)���/� �+()� "���ก�� !������.�/.$/3 ก���� �� �
ก��+�9��ก���$%��+,�������� "�� ��/�3/*�+��ก!/)��1�� ������! ��ก�� !�� )� .$������ , �ก�����ก/,ก��� � .$�����4/���� � $/��! �ก��������
10. .����$,��4���������ก�� !�������/�4�
5. ��� ก�������ก��� � 1. �.�()��.��+/$����' 2. �.$������ ) 8,9 3. ����� ) 8,9
6. ก��!��"# ����$�"# 6.1 $/3 $��
6.1.1 ���ก�+:�/ก���� )+1����.' 6.1.2 �����;<ก�7/���/,�/�
6.2 �.�()���(�$��4�
6.2.1 ������ก�+:�/ก���� )+1����.' 6.2.2 ���ก�������;<ก�7/���/,�/�
7. %� ��� ���
8. &��'(ก)#��ก��� �
���()� (��!��&(�� �,=�) .��4����
9. �!���)*�% �"��&�$)��
���()� ( )
����"���
�) ���I��� 8 ��! "� ก������������ก�������"�
1. ก��?��@A���A()B�C
����� �&��������ก")��*) �� ������/�#(��กJ��� #�ก�����&����������� ����)�������/�#(��ก ���&�ก����"���/�"����/��� PhotoShop ก�"��&���������N�J� �� ����� Attribute Width & Height �� TAG <IMG> �) ^���/ �����N��&��#� ก���#�/������ก����ก�J �/� &��' ��� �����ก����" / �������/��� !" Image, Image Size... $% ����กbN"����&����/'���c
�(B�C%8�)�� Image, Image Size
��') �� Pixel Dimensions �/�����.��')����� ���/ ��#�% � "�ก ��N���')�#�"'���'�J ���.����"�ก����') ���"��'c��"� �� N���"��ก��Jก���ก����!"ก�"� Constrain Proportions
ก�"�
2. ก��C72CHA$(I/�2
��" ��ก����ก �������������#�% ��� �J��&��������ก")�"ก�����*) �/���Jh�ก�������/'���c
• ���/���+��� #�!"������Jc�����#� • �Jก��!"ก� �! "�!" Text Tool • ��!"ก�I��))"'กi�N�ก Text Options Bar
o �I��))ก�������"'กi� �'��������%)�����"'กi��� ����� ���� ก&�#�/ ������กb��������"�+��" �� �l��� �'���������� N������"'กi�������"�+�mNN̂)'� ������กb�n�������� ������
o ��!"ก�Jo���ก���J�+
o ��!"ก�))"'กi�
o ��!"ก�'กil�"'กi�
o ��!"ก���/"'กi�
o ��!"ก�I��))�"������")�")"'กi�
o ��!"ก�&��#���ก�������" ��
o ��!"ก����" ��
o ��!"ก�'กil��J�oi
• �&����+�� �Jก l �&��#����� ��"�ก���J�+��" ��
• �J�+��" ���� ��"�ก�� ����.����^p ��! "�%c�)���'/�#� #�!" <Backspace> ��! "�)�ก���
• �l��� �J�+ ����. Select �'�"'กi� �����')�����n����'�"'กi��/� • �l��� �J�+ ����.�����&��#�����" �� �/��&����+����c�J/�������"���" ��
N���'กil�/'���c
N�ก�'c�ก/�^p���+ ������ ��ก���'��&��#����� ��"�ก�� #�!"ก/�^p ������ ������ก���'��&��#����� ��"�ก��
• �! "��"�ก���^�Jก���J�+ �#� �Jก���+�� �^p� �! "�!""! � #�!" �Jก�� �^p
#���#�̂
�&�#�')� �! "�!" Type Mask N����กb��������� ������ $% ���"���� &��' � ��"����cN'/ก��
• ��!"ก�� Foreground $% �N�����������"������") ������!"ก &��' � Edit, Stroke ��! "��J�����")��" ��
• ��!"ก�� Background $% �N�����������!c��"���" �� ����� ��!"ก &��' � Edit, Fill, Background Color ��! "��J���!c��"���" ��
3. ก�� 0'(ก@�)+./�A()B�C2�J3$)�� (Crop Image)
�I��� �&���������*) 'กN��������.����� t���ก����ก�/���� �! "���ก���"�+ �! "�&����� tI����"�NN���"�ก�������)�������"���� N%���"��&�ก����!"ก�����"���� ����'/������� �������ก�'c��"�ก����!"ก��� ����'/����n��������� ��!"ก������c��� Crop $% � PhotoShop � &��' �/'���c
1. ���/���+����� ��"�ก��
2. ��!"ก� �! "�!" Marquee #�ก�����กb� �! "�!"��c ��/�����ก������ ����J/� �! "�!" ��������.���� ��ก�')�/�ก���&����+� �Jก �������� �^p� �! "�!""'���ก ���.)� �! "�!" N����กb�^/� �! "�!" /'���c
N�ก�'c���! "����+��! "��!"ก� �! "�!" Marquee
3. �&����+$% ���I���������ก�ก)����*กv ���c l ^)�$����"��&��#�������� ��"�ก�� ก/�^p���+ ������ ��ก���+ N����กb������� �#���ก���+�#��/����/�"���������� �^����� ��"�ก��
4. #�ก��"�ก���ก��Jกก����!"ก�!c��� ��� �#���!"ก &��' � Select, None 5. �! "�/����/�"������ ��"�ก�� ก*N��&�ก���'/��� /��� &��' � Image, Crop
N�ก����'�"���� N��/�t��'�h+ /'���c
&��' � Image, Crop N%��#����� �'/�����"������ ���N ��! "�&���������
4. B�CN$(�
1.��J N�ก���/���+�����ก�%c��ก�"� �'�"����N����/���+����! " shoes.jpg N�ก����/"�+ samples �"� Adobe N�ก�'c����/���+��� fruit.jpg N�ก����/"�+�/J 2.���/#������� Layer /��� &��' � Window, Show Layers 3./��� �Jก� �! "�!" Marquee �&����+����ก�������)���� fruit �#��/��!c��� ������/�� ��"�ก�� 4.ก/�^p <Ctrl> <C> ����ก���&������N"��� shoes /��� &��' � Window, Shoes �&������ '/�"ก����/��� &��' � <Ctrl> <V> ����� '/�"ก���N��$�"�������n)') !" ��� shoes
5.+�1??�, �O�+8�I�PA()B�Cก��QRก+8�-��@)�� /O@
ก���&����ก����ก��! "����������*) �#�'กก���n�����ก������N�ก����! "�J ��J�+ �'c���! "� �����"��/�"���� (Resolution) �� �������� 72 dpi #�!"N&�������� �����/�t� ������� /'��'c�ก��o%กi�.%� �'กil��n�����ก����� PhotoShop �����ก����ก�������*) N%�����o����+�� ������N"�กo����+#�% �
?�, �O�+8�I�PA()B�Cก��QRก+8�-��@)�� /O@
• ��� �� �����"��/�"���� (Resolution) 72 dpi • ����#/ RGB ��ก���������� • ��"� &��%�.%� Screen Area �"�N"��� /'���c
o 640 x 480 pixel o 800 x 600 pixel o 1024 x 768 pixel
• �ก*)���+���n)')�����" (.psd �! "��� PhotoShop)
o ��!"ก���������+�������#��#��� o ����� �����"�, ��"�ก�� �� �'/� &� )'��%ก���� .gif o ����� ��"�ก�� �� �'/�I�v ��/����กv )'��%ก���� .jpg
• ก&�#�/�'กil��J�oi�"�����#��#��� ���� ก����� ������. Interlaced, Progressive, Transparent
• ����� ����/�#(�v �ก ������� �J ก���'/��������Jc���*กv �����&�����ก")/��� &��' � HTML
�)����� 8 ��! "� ก������������ก�������"�
&��' � 1. �#��'ก������&��I������ �Iก&�#�/�#������&�ก����"������� �/�������&�/')�'c��"��Jh�ก���&����� �'ก����������N . 2. �#��'ก������J�+��" ���� �Iก&�#�/�#������&��#���������� �� �ก�����#�������/��&��#��J�J��J ������ ���I���"/N��"��� ���� v �/�������&�/')�'c��"��Jh�ก���&����� �'ก����������N .
3. �#��'ก������&��I������ �Iก&�#�/�#������&�ก���'/�n���)�������"�������� �/�������&�/')�'c��"��Jh�ก���&����� �'ก����������N .
4. �#��'ก������&��I������ �Iก&�#�/�#������&�ก��$�"���� �/�������&�/')�'c��"��Jh�ก���&����� �'ก����������N .
�) ���I��� 9 ��! "� ก������������ก�����
1. ก��ก8�-��I1S+2@�T7B�C I0'&(�U-/
Dropper Tool
ก��ก�������� ����������������������������������
1. ���#ก$%������&�� Movie Properties 1�#$%����2 Modify > Movie
2. ก����� Frame Rate ��&�ก� 12 fps Dimensions Width��&�ก� 400 px C�D Dimensions Height 300 px
3. ก�������������� ����������1�#$%�����H���ก������������� Background Color ODP��กQ Dropper Tool $%�����H���ก����ก���������ก��
� ���#ก$%���������&�� Movie Properties
� ก�������� ���
�ก������������������������
2 ก��J3$ I�'&()2'(/���#?
ก��$%���������������2P������������������
1. $%�����H���ก��� Pencil Tool �C� ����������
2. ����ก Options �����&��T��C� �����������PU�C Smooth
3. $%�����H��ก���������� 1 �������ก����������������C�D����1��� 2 �����PU�����2กC��1�W&�X�ก
� ���#ก$%� Pencil Tool
��P���#� Option T�� Pencil Tool
���������2PC��1�
� ���#ก$%� Paint Bucket Tool
��P���#��� Fill Color
� ��������C��
4. $%�����H���ก��� Paint Bucket Tool �C� ����������
5. $%�����H���ก��� Fill Color ODP��กQ�����&��O���� $������ก��C��
6. ������������$��PU���C��
7. $%�����H���ก��� Fill Color C�������ก��C ��&�D�� �� (Gradient) ���T�#�
��P���#��� Fill Color
� ���������T�#�
8. ��������������ก�PU����T�#��PU���ก`D�P���กC��1�
9. $%�����H���ก��� Brush Tool �C� ����������
10. ����ก Options Brush Tool �����&��T��C� �����������PU�C ��ก��T�����bก
11. $%�����H���ก��� Fill Color ODP��กQ�����&��O���� $������ก�����
12. $%�����H����2P�PU����b�C��1� �������� �
���#ก$%� Brush Tool
�P���#� Option
�� ����2P���b�C��1������&�� Frame
�� �P���#��� Fill Color
Tool 2
Tool 1
Frame By
Frame 3
Frame By
Frame 1
Frame By
Frame 2
Tools
3
Movie Propertie
s
3. ก��+�$�)B�C I0'&(�U-/�@@ Frame By Frame
� ������2P��� ก��������������������C Frame By Frame ������������������
1. ������2P������1.2 T�� 1 - 12
2. $%�����H���ก��� Arrow Tool �C� ����������
3. $%�����H��ก��� �2P����������ODP��กQ�2P�������2ก����ก������
4. ���#ก$%������&�� Symbol Properties 1�#ก��ก�CPg� ����H F8 ����$%����2 Insert > Convert to Symbol
� ���#ก$%� Arrow Tool
� ����ก�2P����������
� ���#ก$%������&�� Symbol Properties
� CP���2P����PU� Symbol 5. CP���2P����PU� Symbol 1�#ก�������������&�� Symbol Properties ����ก Behavior �PU�C Graphic
6. $%�����H���ก����i����� 5 (%&����������#������$����T 5)
7. C��ก Keyframe ����i�� 5 1�#���#ก$%����2 Insert > Keyframe ����ก�CPg�����H F6
8. �����C��ก Keyframe C���ODP��กQ��k��ก`H Keyframe ����i�� 5
� C��กก��C���W��i����� 5 P���2P����PU� Symbol
� ���#ก$%����2C��ก Keyframe
� Keyframe ����i�� 5
���#ก$%����2 Rotate 9. ���#ก$%����2 Modify > Transform > Rotate ODP��กQPl��� �2P��� 8Pl�
10. $%�����H���ก������ X��# �C�����กTm������ �
11. C��ก Frame ����i�� 8 1�#$%�����H���ก���%&�� Frame ��� 8 C������#ก$%����2 Insert > Frame ����$%�CPg�����H F5
12. C������������� ���1�#���#ก$%����2 Control > Play ����ก�CPg�����H Enter ODP��กQ�������������C Frame By Frame
���P�� �P���#��2P���
�� C��ก Frame ����i�� 8
4. ก��+�$�)B�C I0'&(�U-/�@@ Frame By Frame
�� C����������������
� ���#ก$%� Oval Tool
� CP���2P�PU� Symbol
�C��ก Keyframe
������ Motion Tween
� ��/����� �! "��#�
�)����� 9 ��! "� ก������������ก�����
&��' � 1. �#��'ก�����ก&�#�/ �� DocumentProperty ���� �Iก&�#�/�#� �/�������&�/')�'c��"��Jh�ก���&����� �'ก����������N . 2. �#��'ก�������/�I����������������� �Iก&�#�/�#� �/�������&�/')�'c��"��Jh�ก���&����� �'ก����������N .
3. �#��'ก������&��I������� ��/��&����� �! "��#��))���)����� �/�������&�/')�'c��"��Jh�ก���&����� �'ก����������N .
4. �#��'ก�������/�I���ก������&��#�� �! "��#��)) Motiontween �/�������&�/')�'c��"��Jh�ก���&����� �'ก����������N .
� � � � �
�@@?�, 27��0ก��%8�)��
กJNก���� 1 กJNก���� 2 ��
�! " D �ก^� �/� ���/� �/� ���/�
� � � � �
�@@?�, 27��0ก��%8�)��
กJNก���� 3 กJNก���� 4 ��
�! " D �ก^� �/� ���/� �/� ���/�
�@@+�) กTCXT7ก��2%!&CY)?�,+)IH
I1S0�กZS,%!&CY)?�,+)IH ��" 1. �bJ)'�J�����)��)�J�'��"��������� (2 ����) ��" 2. $! "�'��+�^N�J���"���"����tI�"! � (2 ����) ��" 3. �')tJ/�")��"���"����������� (3 ����) ��" 4. ��'� ���� �#���ก')ก�����o����)^ � (3 ����)
�� �! " D �ก^� ��" 1 ��" 2 ��" 3 ��" 4
�กl~+ก���'/t�����J�t�
9 D 10 ���� = /��ก 7 D 8 ���� = /�
5 D 6 ���� = �"��� � &�ก��� 5 ���� = ��"���')��̂�
� � � � �