前端初心者談，合作過程與學習經驗

2016 - 04 - 07 @ NCC x 第二次社聚

Transcript

1. લ୺ॳ৺ऀஊ
   ߹࡞աఔᢛላशៃᱛ 2016 - 04 - 07 @ NCC
   x
   ୈೋ࣍ࣾᡉ
   Irene Chang
2. ுխᣊ
   Irene Chang http://irene84111.github.io irene84111@gmail.com ‣ ୆Պେ
   /
   ঎ۀઃܭೋ೥ڃ
   ‣ ୆Պେఔࣜઃܭݚڀࣾ
   /
   ઃܭࢣ
   x
   ߨࢣ
   ‣ EXMA-square
   /
   લ୺መशੜ
   ‣ ᓞ፝ཟᏐҐ૑ҙ
   /
   ઃܭ
   x
   લ୺መशੜ
3. ෼ڗେߝ A B C ઃܭࢣ࿨޻ఔࢣཁ೗Կ߹࡞ʁ ೗Կ੒ҝલ୺ઃܭࢣʁ ᕆஊ໢ทઃܭ
4. ઃܭࢣ࿨޻ఔࢣཁ೗Կ߹࡞ʁ
5. ઃܭࢣ
   Designer ‣ ख़࿅
   PhotoshopɺIllustrator
   ౳ ॏཁతӨ૾
   
   ៸ᅷ޻۩
   ‣ PinterestɺBehanceɺDribbble
   ౳׆༂తࣾ܈
   ‣ ༴༗ฏ໘ઃܭ஌ࣝᢛඒײ
6. લ୺޻ఔࢣ
   Front-end Programmer ‣ ख़࿅
   HTMLɺCSS
   ࿨
   JavaScript
   
   ‣ 4BTT
   ࿨൛ຊ߇੍໵ੋඞඋతٕज़
   ‣ ༴༗લ୺஌ࣝɼ໵ྃղޙ୺ݪཧ
7. टઌཁ஌ಓ൴ࠑ೭ؒతࠩผ ฏ໘ઃܭ ໢ทઃܭ ࢴுɺ෍ྉ౳ ෆಉईੇ೭ᰖࣔث ७ᯩଶ ಉ࣌۩༗ᯩଶᢛಈଶݩૉ
 ໵ਢߟྀޓಈੑ ແ๏ߋ৽ᢛमਖ਼
 ֱ೉औಘ࢖༻ऀճᰶ ༰қߋ৽ᢛमਖ਼
 ֱқऔಘ࢖༻ऀճᰶ ࢹ᧷తি㐝ྗ ࢿਜ݁ߏ᮫܎
8. ઃܭࢣґ٬㖽धٻઃܭท໘త
   PSD
   䈕
   ࠶ަ༝લ୺޻ఔࢣሡ໢ท၏ग़ိ
9. ୠ࠷ॏཁతࠩผࡏԙ ޓಈੑ ఄݱഔհ
10. PSD
    ୞ೳᯩଶ ఄݱɼ༗ઃܭ ্తݶ੍
11. ߋผఏಉҰݸท໘ࢸগཁઃܭࡾछ൛ຊ
12. ൴ࠑྃղ࿨ߔ௨኷ॏཁ
13. Ꮣ੒ઃܭࢣᢛ޻ఔࢣ೭ؒతڮ䖻 ҃ऀ㟬໵ՄҎ௨௨ࣗݾိ Front-end Designer
14. ART & DESIGN Web Designer Front-end Designer Back-end Developer Computer Science
15. ೗Կ੒ҝલ୺ઃܭࢣʁ
16. A Ұఆཁላత
    HTML, CSS, JavaScript https://www.codecademy.com/
17. ྃղ໢ทઃܭ਼੎ᢛሢ༗໊ࢺ http://webdesignerdepot.com/ ‣ 3FTQPOTJWF
    8FC
    %FTJHO
    ‣ 1BSBMMBY
    4DSPMMJOH
    ‣ 4JOHMF
    1BHF
    ‣ -BOEJOH
    1BHF
    ‣ 'SBNFXPSLT
    ‣ .PCJMF
    'JSTU
    ‣ ʜ B
18. ଟ؃ɺଟሜɺଟ໛㟩 http://awwwards.com/ ‣ ྃղ໢ท਼੎࿨ٕज़ᚙల
    ‣ ഓཆඒײɺ܇࿅ٕ޼
    ‣ ળ༻։ᚙऀ޻۩
    ‣ Ꮕूჩߟࢿྉ
    ‣ อ࣋ਐ㑊తಈྗ C
19. ળ༻޻۩ɺଟํ㐪ᘓ D
20. ሜʂಈखʂҝࣗݾԼݸ໨ඪʂ http://irene84111.github.io/ ‣ ॄኄ౎ೳሜ
    հ঺঎඼
    
    ᅶୂ
    
    ׆ಈ
    
    "11
    తท໘ɺఏڙ Ұ߲෰຿తฏ୆
    ⋯⋯
    ‣ ݸਓ໢᜾
    ‣ ઀Ҋࢠ
    ‣ መश ៃᱛ෼ڗ E
21. B. Sprite C. ໢ทՍߏ ៃᱛ෼ڗ A. Width / Height v.s Padding
22.  ఏঋӳจೳྗɼ㟬ՄҎಘ౸ߋଟࢿݯ
     ፙ๎༑Ұى૊ୂ࿅ޭɼᩋ㟬ࣄഒޭ൒
     ଟჩᢛࣾ܈҃޻࡞๥ɼػ။౸႔౎༗ F
23. ᕆஊ໢ทઃܭ
24. A 清楚的網⾴頁導覽與資訊流 YouTube Pinterest
26. ⼀一致的版⾯面設計與⾵風格 B
28. ໌֬ɺਫ਼؆త㚎༰ C Google Smallpdf
29. қ㣛తᅷࣔᢛૢ࡞ D
30. E 善⽤用 Wireframe ‣ ख៸҃؆қഉ൛
    ‣ ૝๏۩ᱪԽ
    ‣ ଅਐ౼࿦Ꮘ཰
    ‣ ਐߦշ଎मվ
    ‣ ݮগ։ᚙલظ੒ຊ
31. ᙛ㟬༗৺ಘྃɼ෼ڗ㠧ʂ
    ૝ྎղߋଟɼ໵ᓣܴ࣋᠃௥᪦զ
    :-) http://irene84111.github.io/blog Thank You!