ఆఫ్టర్ ఎఫెక్ట్స్‌లో బ్రాండెడ్ లోడింగ్ యానిమేషన్‌ను రూపొందించండి

విషయము

• 01. క్రొత్త క్రమాన్ని సృష్టించండి
• 02. మీ కార్యాలయాలను క్రమబద్ధీకరించండి
• 03. కొన్ని ఆకారాలు చేయండి
• 04. రంగును జోడించండి
• 05. మీ పొరలను నకిలీ చేయండి
• 06. యాంకర్ పాయింట్లను ఉపయోగించండి
• 07. సమయాన్ని అస్థిరం చేయండి
• 08. మరిన్ని రంగులు జోడించండి
• 09. మొదటి ప్రివ్యూ చేయండి
• 10. కీఫ్రేమ్‌ను సృష్టించండి
• 11. మరొక కీఫ్రేమ్ చేయండి
• 12. మరిన్ని కీఫ్రేమ్‌లను తయారు చేయండి
• 13. మళ్ళీ ప్రివ్యూ చేయండి
• 14. సడలింపును సర్దుబాటు చేయండి
• 15. లోగో జోడించండి
• 16. పరిదృశ్యం మరియు ఎగుమతి
• 17. ఫోటోషాప్‌కు వెళ్లండి
• 18. ఇవన్నీ మంచివని తనిఖీ చేయండి
• 19. మీ GIF ని ఎగుమతి చేయండి
• 20. మీరు పూర్తి చేసారు!

మంచి దృశ్య రూపకల్పన సులభంగా మరియు తేలికగా వస్తోంది. నిజమైన డిజైన్ చాప్స్ ఎవరికి వచ్చాయో మరియు మంచి వెబ్‌సైట్ టెంప్లేట్‌లు లేదా UI కిట్‌లకు ఎవరు ప్రాప్యత కలిగి ఉన్నారో చెప్పడం కష్టం. దీని అర్థం ప్రభావవంతమైన వినియోగదారు అనుభవాన్ని సృష్టించడానికి, మీరు ప్రజలు ఆశిస్తున్నదానికంటే పైన మరియు దాటి వెళ్లాలి.

మరపురాని కొన్ని మెరుగులు చిన్నవి. మీ ప్రచారానికి పంపండి నొక్కినప్పుడు కనిపించే మెయిల్‌చింప్ యొక్క ప్రసిద్ధ ‘మంకీ హ్యాండ్ హై ఫైవ్’ గురించి ఆలోచించండి. సాధారణ విజయ సందేశానికి బదులుగా, మీరు expect హించినట్లుగా, వారు కొంచెం లోతుగా తవ్వి, వారి బ్రాండ్‌ను అనుభవంలోకి తీసుకువచ్చారు. మేము ఇక్కడ ఏ కోతి పావులను యానిమేట్ చేయము, కానీ మేము మీ స్వంత బ్రాండ్ రంగులు మరియు లోగోతో అనుకూలీకరించడానికి సులభమైన రంగురంగుల లోడింగ్ యానిమేషన్‌ను తయారు చేస్తాము. మీరు క్రింద ఇన్విజన్ యొక్క ఉదాహరణను చూడవచ్చు:

లోడింగ్ యానిమేషన్ క్రమాన్ని సృష్టించడానికి మేము తరువాత ప్రభావాలను ఉపయోగిస్తాము, ఆపై మా ఎగుమతి చేసిన వీడియో ఫైల్‌ను ఫోటోషాప్‌లోకి తీసుకువస్తాము మరియు తేలికపాటి GIF గా మారుస్తాము, మీకు యానిమేటెడ్ లోడింగ్ ఎలిమెంట్ అవసరమైన చోట ప్రారంభించవచ్చు.

మీరు ప్రవేశించడానికి ముందు, మీరు నాలుగు బ్రాండ్ రంగులను ఎంచుకొని, మీ లోగో యొక్క చిన్న, ఒకే-రంగు, పారదర్శక సంస్కరణను కలిగి ఉండాలి. మీరు ఎఫెక్ట్స్ తర్వాత నేర్చుకోవటానికి అర్ధమైతే, మీరు దూకడం, ప్రత్యేకంగా మీదే సృష్టించడం మరియు ఈ ప్రక్రియలో కొన్ని గొప్ప ప్రాథమిక పద్ధతులను నేర్చుకోవడం మీకు సరైన అవకాశం.

ఈ ప్రత్యేకమైన స్క్రీన్‌కాస్ట్‌ను చూడండి లేదా మీ లోడింగ్ యానిమేషన్‌ను సృష్టించడానికి క్రింది దశలను అనుసరించండి.

01. క్రొత్త క్రమాన్ని సృష్టించండి

ప్రభావాల తరువాత తెరిచి నొక్కండి cmd + N. క్రొత్త క్రమాన్ని సృష్టించడానికి. మా వీడియో చదరపుగా ఉండబోతున్నందున, ప్రామాణిక 16: 9 కారక నిష్పత్తికి బదులుగా, కూర్పు సెట్టింగులలో వెడల్పు మరియు ఎత్తును 120 పిక్స్‌కు మార్చండి మరియు సరి క్లిక్ చేయండి. మా GIF యొక్క సిఫార్సు చేయబడిన తుది అవుట్పుట్ 60px అవుతుంది, కానీ మేము రెటినా స్క్రీన్‌ల కోసం కూడా లెక్కించగలగాలి.

02. మీ కార్యాలయాలను క్రమబద్ధీకరించండి

మేము కొనసాగడానికి ముందు, మా ఆఫ్టర్ ఎఫెక్ట్స్ వర్క్‌స్పేస్‌లు ఒకేలా ఉన్నాయని నిర్ధారించుకుందాం. మీ టాప్ మెనూలో, వెళ్ళండి విండో> వర్క్‌స్పేస్> స్టాండర్డ్. ఈ విధంగా, నేను "మీ స్క్రీన్ దిగువ కుడి వైపున ఆ విషయం క్లిక్ చేయండి" అని చెప్పినప్పుడు అది మీ స్క్రీన్ కుడి దిగువన ఉంటుంది.

03. కొన్ని ఆకారాలు చేయండి

ఇప్పుడు మన యానిమేటెడ్ రంగు బ్లాక్‌లుగా మారే కొన్ని చదరపు ఆకృతులను సృష్టించండి. మీ క్రమంపై క్లిక్ చేయండి (స్క్రీన్ మధ్యలో ఉన్న నల్ల చతురస్రం), నొక్కండి ప్ర, అప్పుడు Shift + క్లిక్ చేసి లాగండి తెరపై ఒక చదరపు కాబట్టి అంచులు కూర్పు యొక్క అంచుల వెలుపల విస్తరించి ఉంటాయి.

ఆకారాన్ని స్క్రీన్‌పై ఖచ్చితంగా కేంద్రీకరించడం మంచి పద్ధతి. దిగువ-కుడి వైపున ఉన్న సమలేఖన ప్యానెల్‌లో, క్షితిజసమాంతర కేంద్రం అమరిక మరియు లంబ కేంద్రాల అమరిక క్లిక్ చేయండి.

04. రంగును జోడించండి

మీ ఆకారం ఇంకా ఎంచుకోబడినప్పుడు, మీ స్క్రీన్ ఎగువన ఉన్న రంగు రంగు నింపండి ఎంపికను క్లిక్ చేసి, మీ ప్రాధమిక బ్రాండ్ రంగులలో ఒకదాన్ని హెక్స్ లేదా RGB విలువగా నమోదు చేయండి. స్క్రీన్‌పై మరెక్కడైనా రంగులను నమూనా చేయడానికి మీరు ఐడ్రోపర్ సాధనాన్ని ఉపయోగించవచ్చు, తరువాత ప్రభావాల విండో వెలుపల రంగులతో సహా, ఇది సహాయపడుతుంది.

05. మీ పొరలను నకిలీ చేయండి

మీ స్క్రీన్ దిగువన మీరు ‘షేప్ లేయర్ 1’ అనే ఒకే పొరతో కాలక్రమం చూస్తారు. టైమ్‌లైన్‌లోని పేరు లేదా నీలిరంగు పట్టీపై క్లిక్ చేయడం ద్వారా దాన్ని ఎంచుకుని, నొక్కండి ctrl / cmd + D. నకిలీ చేయడానికి నాలుగు సార్లు. మీరు మీ టైమ్‌లైన్‌లో ఒకేలా ఐదు పొరలతో ముగించాలి. వీటికి షేప్ లేయర్ 1, 2, 3, 4 మరియు 5 అనే పేరు ఉంటుంది.

06. యాంకర్ పాయింట్లను ఉపయోగించండి

ప్రతి ఆకారం స్క్రీన్ యొక్క వేరే వైపు నుండి యానిమేట్ చేయబోతోంది. దీన్ని సులభతరం చేయడానికి, మేము మా యాంకర్ పాయింట్ల స్థానాన్ని ముందుగానే మారుస్తాము. షేప్ లేయర్ 2 ఎంచుకోండి మరియు నొక్కండి వై యాంకర్ పాయింట్ సాధనాన్ని తీసుకురావడానికి. అప్పుడు మీ యాంకర్ పాయింట్‌పై క్లిక్ చేయండి (ఇది మీ ఆకారం లోపల ఎక్కడో క్రాస్‌హైర్‌ల వలె కనిపిస్తుంది) మరియు దానిని మీ చదరపు దిగువ అంచుకు లాగండి. 3-5 పొరలపై పునరావృతం చేయండి, ప్రతి యాంకర్ పాయింట్‌ను చివరిదానికంటే వేరే అంచున ఉంచండి. ఆకృతి పొర 1 కు మీరు ఏమీ చేయనవసరం లేదు.

07. సమయాన్ని అస్థిరం చేయండి

ఇప్పుడు టైమ్‌లైన్‌లో మా ఆకారాల సమయాన్ని అస్థిరం చేసే సమయం వచ్చింది. నొక్కండి వి మీ ఎంపిక సాధనానికి మరియు మీ కాలక్రమంలో మారడానికి shift + క్లిక్ చేయండి 3-5 పొరల కోసం నీలిరంగు పట్టీలు మరియు వాటిని కుడి వైపుకు లాగండి, ఒక్కొక్కటి ఒక సెకనుకు అంతరం. అవి మీ కాలక్రమంలో 1, 2 మరియు 3 సెకన్ల మార్కులతో ప్రారంభం కావాలి. మీ టైమ్‌లైన్ చాలా జూమ్ చేయబడితే, నొక్కి ఉంచండి alt మరియు క్రిందికి స్క్రోల్ చేయండి - ఈ చర్య మీ టైమ్‌లైన్‌లోకి మరియు వెలుపల జూమ్ చేస్తుంది.

08. మరిన్ని రంగులు జోడించండి

వ్యక్తిగతంగా 2-4 ఆకారాలను ఎన్నుకోండి మరియు మీరు 4 వ దశలో తిరిగి వచ్చినట్లుగా వాటి పూరక రంగును మార్చండి. మీ మార్పులు జరిగేటట్లు చూడటానికి మీరు సవరించే ఆకారంపై మీ ప్లేహెడ్ (నిలువు ఎరుపు పురోగతి రేఖ) ను లాగవచ్చు. మేము ఆకార పొరలను 1 మరియు 5 ఒకే రంగులో వదిలివేస్తాము, ఎందుకంటే మేము ఒకే రంగులో ప్రారంభమయ్యే మరియు ముగుస్తున్న లూప్‌ను సృష్టిస్తాము. ఇప్పుడే అది అర్ధవంతం కాకపోతే, చింతించకండి - అది అవుతుంది.

09. మొదటి ప్రివ్యూ చేయండి

ఇప్పటివరకు మీ చేతిపనిని పరిదృశ్యం చేయాల్సిన సమయం వచ్చింది. నొక్కండి స్పేస్ బార్ మరియు తెరపై రంగులు మారడాన్ని చూడండి. కొట్టుట స్పేస్ బార్ మళ్ళీ ఆపడానికి (లేదా ఎస్.సి. ఇది పని చేయకపోతే).

10. కీఫ్రేమ్‌ను సృష్టించండి

మీ టైమ్‌లైన్ ప్రారంభానికి మీ ప్లేహెడ్‌ను క్లిక్ చేసి లాగండి. షేప్ లేయర్ 2 ఎంచుకోండి, ఆపై నొక్కండి ఎస్ ఆ ఆకారం కోసం స్కేల్ ఎంపికలను తీసుకురావడానికి మీ కీబోర్డ్‌లో. ఇప్పుడు స్కేల్ పక్కన ఉన్న స్టాప్‌వాచ్ చిహ్నాన్ని క్లిక్ చేసి, స్కేల్ శాతాల పక్కన ఉన్న లింక్ చిహ్నాన్ని ఆపివేసి, రెండవ విలువను 0% కి లాగండి. మీ ప్లేహెడ్ యొక్క ప్రస్తుత ప్రదేశంలో మీ డైమ్‌లైన్‌లో చిన్న వజ్రం కనిపిస్తుంది. అభినందనలు, మీరు కీఫ్రేమ్‌ను సృష్టించారు!

11. మరొక కీఫ్రేమ్ చేయండి

ప్లేహెడ్‌ను 1 సెకను వరకు లాగండి మరియు మీ ఆకారం విలువను 100 శాతానికి తిరిగి సెట్ చేయండి. మరొక కీఫ్రేమ్ మీ టైమ్‌లైన్‌లో ప్లేహెడ్‌లో చూపబడుతుంది. మీ యానిమేషన్‌ను పరిదృశ్యం చేయడానికి ప్లేహెడ్‌ను మీ టైమ్‌లైన్ ప్రారంభానికి తిరిగి లాగండి మరియు స్పేస్‌బార్ నొక్కండి. మీరు ఆకార స్కేల్ పైకి చూడాలి మరియు షేప్ లేయర్ 1 ని కవర్ చేయాలి.

12. మరిన్ని కీఫ్రేమ్‌లను తయారు చేయండి

ఆ దశలను 3-5 ఆకారపు పొరలలో పునరావృతం చేయండి, ప్రతిసారీ పొర యొక్క నీలిరంగు పట్టీ ప్రారంభంలో మీ యానిమేషన్‌ను ప్రారంభించండి, ఇది మేము 1 సెకనుకు ముందే నిలిచిపోతాము. మీరు పూర్తి చేసినప్పుడు, ప్రతి పొర యొక్క మొదటి కీఫ్రేమ్ దాని దిగువ పొర యొక్క చివరి కీఫ్రేమ్‌తో వరుసలో ఉండాలి.

13. మళ్ళీ ప్రివ్యూ చేయండి

మీరు మీ కీఫ్రేమ్‌లను జోడించడం పూర్తయిన తర్వాత, మీ పనిని పరిదృశ్యం చేయండి. వేర్వేరు కోణాల నుండి ఒకదానికొకటి వేర్వేరు ఆకారాలు జారడం మీరు చూడాలి. అదే జరిగితే, మీ ప్లేహెడ్‌ను 4 సెకన్లకు తరలించి, నొక్కండి ఎన్. ఇది మీ యానిమేషన్ ముగింపును సూచిస్తుంది మరియు మీరు మళ్ళీ స్పేస్‌బార్ కొట్టినప్పుడు మీ ప్రివ్యూను లూప్ చేస్తుంది. షేప్ లేయర్ 1 మరియు షేప్ లేయర్ 5 ఒకే రంగు అయితే, అది అతుకులు లేని లూప్‌ను ఏర్పరచాలి.

14. సడలింపును సర్దుబాటు చేయండి

మీ లోగోను జోడించడానికి ఇది దాదాపు సమయం, కానీ అంతగా లేదు. యానిమేషన్ ప్రస్తుతం కొంచెం సరళంగా కనిపిస్తోంది (చదవండి: బోరింగ్) - సడలింపును మార్చడం ద్వారా దాన్ని పెంచుకోండి. పట్టుకొని ఉన్నప్పుడు మార్పు కీ, ప్రతి పొర యొక్క తుది కీఫ్రేమ్‌ను ఎంచుకుని, దానిపై కుడి క్లిక్ చేయండి. కీఫ్రేమ్ వేగాన్ని ఎంచుకోండి, ఆపై ఇన్‌కమింగ్ వేగాన్ని 100 శాతానికి సెట్ చేసి, డైమెన్షన్ X మరియు Y ని మాత్రమే వదిలివేయండి. సరే క్లిక్ చేసి మళ్ళీ ప్రివ్యూ చేయండి. యానిమేషన్లు చాలా నెమ్మదిగా మందగించడం మీరు గమనించవచ్చు, ఇది మరింత డైనమిక్ అనుభూతిని సృష్టిస్తుంది.

15. లోగో జోడించండి

ఇప్పుడు మేము మీ లోగోను యానిమేషన్ పైన జోడించడానికి సిద్ధంగా ఉన్నాము. మీ స్క్రీన్ ఎడమ వైపున ఉన్న ప్రాజెక్ట్ ప్యానెల్‌లో, కాంప్ 1 క్రింద ఉన్న ఖాళీ ప్రాంతాన్ని డబుల్ క్లిక్ చేసి, మీ ఇమేజ్ ఫైల్‌ను దిగుమతి చేసుకోండి (ఇది పిఎన్‌జి లేదా ఇపిఎస్ వంటి పారదర్శక ఇమేజ్ ఫార్మాట్ అయితే మంచిది.) ఆపై దాన్ని మీ ప్రారంభంలో లాగండి కాలక్రమం, ఇది అగ్ర పొరగా మారుతుంది. మీరు కొట్టవచ్చు ఎస్ మీ లోగోను పైకి లేదా క్రిందికి స్కేల్ చేయడానికి, మరియు కూర్పులో డెడ్ సెంటర్‌ను ఉంచడానికి మళ్లీ సమలేఖనం ప్యానెల్‌ని ఉపయోగించండి.

16. పరిదృశ్యం మరియు ఎగుమతి

మీ లోగో యొక్క పరిమాణం మరియు ప్లేస్‌మెంట్ పట్ల మీరు సంతోషంగా ఉన్నప్పుడు, మళ్లీ ప్లే క్లిక్ చేసి, ప్రతిదీ ఇంకా బాగానే ఉందని నిర్ధారించుకోండి. అలా చేస్తే, మీ వీడియోను ఎగుమతి చేసే సమయం వచ్చింది. వెళ్ళండి ఫైల్> ఎగుమతి> రెండర్ క్యూకు జోడించు, ఆపై మీ రెండర్ సెట్టింగులను ఉత్తమంగా, అవుట్‌పుట్ మాడ్యూల్‌ను లాస్‌లెస్‌గా సెట్ చేసి, అవుట్పుట్ టు ఏరియాలోని ఫైల్ పేరును క్లిక్ చేయడం ద్వారా మీ వీడియో ఫైల్‌ను ఎక్కడ ఉంచాలో ఎంచుకోండి.

17. ఫోటోషాప్‌కు వెళ్లండి

ఇప్పుడు ఫోటోషాప్‌ను బూట్ చేసి, మా వీడియోను యానిమేటెడ్ GIF గా మార్చడానికి సమయం ఆసన్నమైంది. ఫోటోషాప్‌లో, వెళ్లండి ఫైల్> దిగుమతి> వీడియో ఫ్రేమ్‌లను పొరలకు మరియు మీ వీడియో ఫైల్‌ను ఎంచుకోండి. కింది ప్రాంప్ట్‌లో మీ వీడియో కోసం అనేక దిగుమతి సెట్టింగ్‌లను సర్దుబాటు చేసే అవకాశం ఉంది. అయితే, ఈ యానిమేషన్ చాలా చిన్నది కాబట్టి, మేము సరే క్లిక్ చేయండి.

18. ఇవన్నీ మంచివని తనిఖీ చేయండి

ఫోటోషాప్‌లోని మీ GIF తో ఏమీ అల్లరిగా అనిపించకుండా ఉండటానికి, వెళ్లండి విండో> కాలక్రమం కాలక్రమం తీసుకురావడానికి మరియు దిగువ ఎడమ చేతి మూలలోని ప్లే బటన్‌ను క్లిక్ చేయండి. ప్లేబ్యాక్ 100% వేగంతో ఉండకపోవచ్చు, కాబట్టి నెమ్మదిగా అనిపిస్తే ఎక్కువ చింతించకండి. ప్రతిదీ సరే ద్వారా వచ్చిందని మరియు లూప్ చేసేటప్పుడు ఇవన్నీ సున్నితంగా మరియు అతుకులుగా అనిపిస్తాయని మీరు నిర్ధారించుకోవాలి.

19. మీ GIF ని ఎగుమతి చేయండి

మీ GIF ని సేవ్ చేయడానికి, నొక్కండి ctrl / cmd + alt + shift + S. వెబ్ కోసం సేవ్ చేయి విండోను తీసుకురావడానికి. పైభాగంలో, ఫైల్ రకంగా GIF ని ఎంచుకోండి మరియు దాని పైన ప్రీసెట్ డ్రాప్-డౌన్లో, GIF 128 నో డిథర్ ఎంచుకోండి. విండో దిగువన మీరు తుది అవుట్పుట్ కోసం చిత్ర పరిమాణాన్ని 60px వరకు సర్దుబాటు చేయవచ్చు. యానిమేషన్ లూపింగ్ సెట్టింగులు ఫరెవర్‌కు సెట్ చేయబడిందని నిర్ధారించుకోండి, ఎందుకంటే వజ్రాల మాదిరిగా, GIF ఎప్పటికీ ఉంటుంది (లేదా కనీసం అది ఏమైనప్పటికీ ఉండాలి).

20. మీరు పూర్తి చేసారు!

అభినందనలు! మీరు ఇప్పుడు మీ వెబ్‌సైట్ లేదా అనువర్తనంలో అమలు చేయగల చేతితో తయారు చేసిన, బ్రాండెడ్ GIF ను కలిగి ఉన్నారు, మీ ప్రోటోటైప్‌లకు వాస్తవిక ‘లోడింగ్’ స్థితులను జోడించడానికి ఉపయోగించవచ్చు లేదా ప్రపంచమంతా చూడటానికి డ్రిబుల్ లేదా బెహన్స్‌లో ఉంచండి.

ఈ వ్యాసం మొదట కనిపించింది నెట్, వెబ్ డిజైనర్లు మరియు డెవలపర్‌ల కోసం ప్రపంచంలోని ప్రముఖ పత్రిక. సభ్యత్వాన్ని పొందండి ఇక్కడ.