প্রশিক্ষণ- পর্ব: ফিজিক্স-ব্লাড অ্যানিমেশন

লাফানো অ্যানিমেশন তৈরি করুন বাউন্সিং, এলস্টিক এবং মাধ্যাকর্ষণের প্রভাব কিয়োলেন্সের মাধ্যমে।.

TE: 15 মিনিট ** কঠিন: উন্নত

আপনি কি তৈরি করবেন

ফিজিক্স ভিত্তিক টেক্সট অ্যানিমেশন, কক্ষপথীয় উপাদান এবং মসৃণ ক্যামেরা আন্দোলনের মাধ্যমে প্রকাশিত।.

অদৃশ্য বৈশিষ্ট্য

• ** বাউন্সের পরিমাণ — বাস্তবসম্মত পদার্থের সঙ্গে বলয়ের প্রভাব
• **এলিস্টিক রেস্তরাঁ - স্প্রিং এর মত প্রতিরূপ
• **KCrancication ধ্রুপদী — সঠিকভাবে মাল্টি-মেমার্জী
• **Reberal সম্পর্কীয় অবস্থা — কেন্দ্রবিন্দুতে অবস্থিত
• **Caser dyner deop করুন — মসৃণ জুম ও বড় প্রভাব

ধাপ ১: ক্যানভাস প্রস্তুত করুন

1. PinePaper সম্পাদক খুলুন
2. ঋণ শোধ করার জন্য ক্যানভাস নির্ধারণ করুন( a)
3. পটভূমির রং হিসাবে নির্ধারণ করুন (h)

প্রধান শিরোনাম তৈরি করো

1. টেক্সট টুল-এ ব্যবহারের জন্য Bahrain ফেলেছে
2. কেন্দ্রে ক্লিক করো, টাইপ, ধরন: **PHISCST
3. প্যানেলের বৈশিষ্ট্যের মান:
   • ফন্টের আকার: 120
   • ফন্ট পরিবার: **ITPConfft
   • রং: ্যাপিড মান
4. ক্যানভাসের কেন্দ্রে কেন্দ্রস্থিত

ধাপ ৩: মাধ্যাকর্ষণ ড্রপ অ্যানিমেশন যোগ করুন

আমরা উপর থেকে নীচে ড্রপ করব.

1. টেক্সট নির্বাচন করুন
2. **Timeber প্যানেল খোলা হবে (উপর)
3. কী-বাইন্ডিং যোগ করা হবে:

কোডের সমতুল্য:

const title = app.create('text', {
  content: 'PHYSICS',
  x: 640, y: -100,
  fontSize: 120,
  color: '#ffffff'
});

app.addAnimation(title.data.id, [
  { time: 0, properties: { y: -100, opacity: 0 } },
  { time: 0.3, properties: { y: 360, opacity: 1 }, easing: 'bounce' }
]);

পর্ব ৪:

1. অনুবাদলিপিতে টেক্সট নির্মাণ করুন
2. ফন্টের মাপ: ***s, রং:mm0(0)
3. প্রধান উইন্ডোর মধ্যে অবস্থান

সাইডবারের অ্যানিমেশন যোগ করুন:

কোডের সমতুল্য:

const subtitle = app.create('text', {
  content: 'IN MOTION',
  x: 640, y: 450,
  fontSize: 48,
  color: '#60a5fa'
});

app.addAnimation(subtitle.data.id, [
  { time: 0.4, properties: { scale: 0, opacity: 0 } },
  { time: 0.8, properties: { scale: 1, opacity: 1 }, easing: 'elastic' }
]);

পঞ্চম ধাপ:

কক্ষপথের সঙ্গে দৃশ্যমানতা তৈরি করুন ।.

1. একটি ছোট বৃত্ত তৈরি করুন: **Pholick, olict, রঙ (e)
2. কেন্দ্রে অবস্থিত স্থান
3. সংযোগটি যোগ করুন:

const particle1 = app.create('circle', {
  x: 640, y: 360,
  radius: 8,
  color: '#fbbf24'
});

// Make it orbit around the title center
app.addRelation(particle1.data.id, title.data.id, 'orbits', {
  radius: 150,
  speed: 0.5,
  direction: 'clockwise'
});

4. বিভিন্ন র‍্যান্ডি এবং গতিসহ আরো ২টি পার্টি তৈরি এবং তৈরি করুন:
   • ভগ্নাংশ ২: ১২০ সেন্টিমিটার, গতি ০.৭, রং বলছো (পিঙ্ক)
   • ভগ্নাংশ ৩: ১৮০ ডিগ্রী সেলসিয়াস, গতি ০.৩, রঙ ০৪ (সবুজ)

ধাপ ৬: ক্যামেরা জুম করো

ক্যামেরা অ্যানিমেশনের মাধ্যমে সিনেমাকার অনুভূতি তৈরি করুন।.

// Zoom in slightly during the reveal
app.addRelation('camera', null, 'camera_animates', {
  duration: 2,
  keyframes: [
    { time: 0, zoom: 0.9, center: [640, 360] },
    { time: 0.5, zoom: 1.1, center: [640, 360], easing: 'easeOut' },
    { time: 2, zoom: 1, center: [640, 360], easing: 'easeInOut' }
  ]
});

ধাপ ৭:

1. প্রাকমুদ্রণ প্রদর্শন করতে চাপুন
2. প্রয়োজনীয় সময় পরিবর্তন করুন
3. PiceX(রিমোট) অথবা **G1X+X হিসেবে রপ্তানি করুন
   • অবকাল: **3 সেকেন্ড
   • ফ্রেম
   • লুপ: h (সামাজিক মিডিয়ার জন্য)

সম্পূর্ণ কোড

এখানে উল্লেখ করার জন্য সম্পূর্ণ অ্যানিমেশন কোড:

// Setup
app.setCanvasSize('youtube-thumbnail');
app.setBackgroundColor('#0a0a0a');

// Main title with gravity drop
const title = app.create('text', {
  content: 'PHYSICS',
  x: 640, y: -100,
  fontSize: 120,
  color: '#ffffff',
  fontFamily: 'Inter'
});

app.addAnimation(title.data.id, [
  { time: 0, properties: { y: -100, opacity: 0 } },
  { time: 0.3, properties: { y: 360, opacity: 1 }, easing: 'bounce' }
]);

// Subtitle with elastic spring
const subtitle = app.create('text', {
  content: 'IN MOTION',
  x: 640, y: 450,
  fontSize: 48,
  color: '#60a5fa'
});

app.addAnimation(subtitle.data.id, [
  { time: 0.4, properties: { scale: 0, opacity: 0 } },
  { time: 0.8, properties: { scale: 1, opacity: 1 }, easing: 'elastic' }
]);

// Orbiting particles
const colors = ['#fbbf24', '#f472b6', '#34d399'];
const orbits = [
  { radius: 150, speed: 0.5 },
  { radius: 120, speed: 0.7 },
  { radius: 180, speed: 0.3 }
];

orbits.forEach((orbit, i) => {
  const particle = app.create('circle', {
    x: 640, y: 360,
    radius: 8,
    color: colors[i]
  });

  app.addRelation(particle.data.id, title.data.id, 'orbits', {
    radius: orbit.radius,
    speed: orbit.speed,
    phase: i * (Math.PI * 2 / 3) // Spread evenly
  });
});

// Camera animation
app.addRelation('camera', null, 'camera_animates', {
  duration: 2,
  keyframes: [
    { time: 0, zoom: 0.9, center: [640, 360] },
    { time: 0.5, zoom: 1.1, center: [640, 360], easing: 'easeOut' },
    { time: 2, zoom: 1, center: [640, 360], easing: 'easeInOut' }
  ]
});

// Play with 3-second loop
app.playKeyframeTimeline(3, true);

পরিবর্তন নির্বাচনকারী

আলেকজীয় চিঠি প্রকাশ করুন

অনুরূপ অ্যানিমেশন দ্বারা লেটার কজ ব্যবহার করা হবে:

const collage = app.letterCollage.create('PHYSICS', {
  style: 'tile',
  palette: 'neon',
  fontSize: 80
});

app.letterCollage.applyStaggeredAnimation(collage.collageId, {
  effect: 'popIn',
  staggerDelay: 0.08,
  duration: 0.4,
  easing: 'elastic'
});

পাথের অ্যানিমেশন

কোন বহুভুজের বক্ররেখা অনুসরণ করো:

const star = app.create('star', {
  x: 100, y: 360,
  radius: 20,
  color: '#fbbf24'
});

// Animate along a curved path
app.animate(star, {
  animationType: 'path',
  pathPoints: [
    [100, 360],   // Start
    [400, 200],   // Control point 1
    [800, 500],   // Control point 2
    [1180, 360]   // End
  ],
  pathSmooth: true,
  animationSpeed: 0.3
});

টিপস

**থিং হচ্ছে সব কিছু — সামান্য ভিন্ন সময়ে শুরু করা উপাদান (১-১-১-১০০০ আলাদা), স্বাভাবিক অনুভূতির জন্য।.

Comensected — অবতরণের জন্য অবতরণের জন্য atoool100, ac11, হারিয়ে যাওয়ার জন্য.

ফিজিক্সের জন্য **60ffp — উচ্চ ফ্রেমের হার লাফ/লোস্টিকের প্রভাবকে মসৃণ করে তোলে ।.

পরবর্তী ধাপ

• [ কুকুর অ্যানিমেশন ] (০
• [ মানচিত্র অ্যানিমেশন] — ভৌগলিক তথ্য অ্যানিমেট করো
• [ওয়ার্‌ড সিস্টেম] — ডিপ্রেশনস বিভিন্ন সম্পর্ক গড়ে তুলতে