minorun-marp-skill দিয়ে আরও ভালো Marp প্রেজেন্টেশন স্লাইড তৈরি করুন

minorun-marp-skill কী করে

minorun-marp-skill হলো Marp-এর মাধ্যমে প্রেজেন্টেশন স্লাইড তৈরির জন্য পুনর্ব্যবহারযোগ্য নির্দেশনা ও পরিদর্শন সরঞ্জামের একটি সংগ্রহ। এটি AI এজেন্টদের এমন স্লাইড লিখতে সাহায্য করার জন্য তৈরি, যেগুলো শুধু দৃষ্টিনন্দনই নয়, বরং সুস্পষ্ট গল্প, কার্যকর ডায়াগ্রাম এবং ভারসাম্যপূর্ণ নকশাও ধারণ করে।

প্রকল্পটি এর লেখক Minoru Onda-এর বারবার ব্যবহৃত প্রেজেন্টেশন উন্নয়নের কৌশলগুলো সংগ্রহ করে এবং সেগুলোকে এমন দক্ষতা হিসেবে প্যাকেজ করে, যা Claude Code-এর মতো AI এজেন্ট পড়তে পারে। যারা নিজে Marp Markdown লেখেন, তারাও এই উপকরণ সরাসরি ব্যবহার করতে পারেন।

রিপোজিটরির কাঠামো

রিপোজিটরিটি লেখার নির্দেশনা, ভিজ্যুয়াল ডিজাইন, থিম, যাচাইকরণ সরঞ্জাম এবং উদাহরণ আলাদা করে রেখেছে:

• skills/slide-story-তে হুক, বিভাগ-উদ্বোধনী স্লাইড, ধাপে ধাপে তথ্য উন্মোচন, শিরোনামের ধরন, সমাপ্তি এবং প্রেজেন্টেশনের দৈর্ঘ্য অনুমানের বিষয়গুলো রয়েছে।
• skills/slide-figures-এ ডায়াগ্রামে তথ্যের ঘনত্ব কমানো, SVG চিত্র আঁকা, ন্যূনতম টেক্সটের আকার নির্ধারণ এবং ইলাস্ট্রেশন বসানোর পদ্ধতি ব্যাখ্যা করা হয়েছে।
• skills/slide-design-dark-তে ফাঁকা জায়গা পরিমাপ, উল্লম্ব ভারসাম্য, গাঢ় ব্যাকগ্রাউন্ড, টেবিল, কোড ব্লক এবং Marp-নির্দিষ্ট সমস্যাগুলো নিয়ে আলোচনা করা হয়েছে।
• theme/minorun-dark.css সায়ান অ্যাকসেন্টসহ একটি গাঢ় Marp থিম প্রদান করে।
• tools/-এ রপ্তানি করা PDF এবং SVG আউটপুট পরিমাপের স্ক্রিপ্ট রয়েছে।
• examples/sample-এ একটি নমুনা ডেক রয়েছে, আর examples/broken-এ ইচ্ছাকৃতভাবে কিছু সমস্যা রাখা হয়েছে, যাতে যাচাইকরণগুলো সেগুলো শনাক্ত করতে পারে কি না পরীক্ষা করা যায়।

ইনস্টলেশন ও সেটআপ

Claude Code-এর জন্য দক্ষতাগুলো কপি করুন

Claude Code ব্যবহার করার সময় তিনটি দক্ষতা ডিরেক্টরি আপনার ব্যক্তিগত Claude skill ডিরেক্টরিতে কপি করুন:

cp -r skills/* ~/.claude/skills/

এরপর Claude Code আপনাকে স্লাইড তৈরি বা সংশোধনে সহায়তা করার সময় রিপোজিটরির slide-story, slide-figures এবং slide-design-dark নির্দেশনা ব্যবহার করতে পারবে।

থিম ও সরঞ্জামগুলো আপনার স্লাইড রিপোজিটরিতে কপি করুন

theme/ এবং tools/ ডিরেক্টরিগুলো আপনার ডেক থাকা রিপোজিটরিতে কপি করুন। এতে প্রেজেন্টেশনে ব্যবহৃত Markdown ও অ্যাসেটের পাশাপাশি থিম এবং যাচাইকরণ স্ক্রিপ্টগুলোও রাখা হবে।

প্রয়োজনীয় সরঞ্জাম ইনস্টল করুন

পরিদর্শন স্ক্রিপ্টগুলো Marp CLI, Google Chrome, poppler, mupdf-tools, Python 3 এবং Pillow-এর ওপর নির্ভর করে। নিচের কমান্ড দিয়ে Marp CLI ইনস্টল করুন:

npm i -g @marp-team/marp-cli

macOS-এ PDF ইউটিলিটিগুলো ইনস্টল করতে ব্যবহার করুন:

brew install poppler mupdf-tools

check-svg-box-fit.mjs Marp CLI-এর সঙ্গে বান্ডেল করা puppeteer-core ব্যবহার করে। এর মডিউল বা Chrome এক্সিকিউটেবল স্বয়ংক্রিয়ভাবে খুঁজে পাওয়া না গেলে MARP_NODE_MODULES এবং CHROME_PATH-এর মাধ্যমে তাদের অবস্থান নির্দিষ্ট করুন।

ফন্ট প্রস্তুত করুন

থিমটি গোলাকার Gothic ফন্টের জন্য তৈরি। Zen Maru Gothic ইনস্টল করলে পছন্দনীয় চেহারা পাওয়া যায়। macOS সিস্টেমে এটি না থাকলে থিমটি Hiragino Maru Gothic দিয়ে প্রদর্শিত হবে। ফন্টের উপস্থিতি চূড়ান্ত ডেকের চেহারা পরিবর্তন করতে পারে, তাই স্লাইড রপ্তানির আগে ফন্ট ইনস্টল করে যাচাই করুন।

ডেক তৈরি ও রপ্তানি করুন

deck.md-এর মতো একটি Marp Markdown ফাইলে আপনার স্লাইড লিখুন। অন্তর্ভুক্ত গাঢ় থিম এবং স্থানীয় ফাইল সমর্থন ব্যবহার করে PDF-এ রপ্তানি করুন:

marp --no-stdin deck.md --pdf --theme theme/minorun-dark.css --allow-local-files

--theme অপশনটি রিপোজিটরির গাঢ়, সায়ান-অ্যাকসেন্টযুক্ত নকশা প্রয়োগ করে। --allow-local-files অপশনটি রপ্তানির সময় ডেক থেকে উল্লেখ করা স্থানীয় ছবি ও অন্যান্য অ্যাসেট লোড করার অনুমতি দেয়।

রপ্তানি করা স্লাইড যাচাই করুন

রপ্তানির পর তৈরি PDF এবং যেকোনো SVG চিত্রের ওপর যাচাইকরণগুলো চালান। এই যাচাইকরণগুলো এমন সমস্যা ধরার জন্য তৈরি, যা Markdown সোর্সে সহজে চোখ এড়িয়ে যেতে পারে, কিন্তু রেন্ডার করা প্রেজেন্টেশনে স্পষ্ট দেখা যায়।

মার্জিন যাচাই করুন

python3 tools/check-dark-margins.py deck.pdf

এই যাচাইকরণটি স্লাইডের কনটেন্টের নিচের ও ডান প্রান্তের ফাঁকা জায়গা পরিমাপ করে।

উপাদানগুলোর মধ্যবর্তী ফাঁক যাচাই করুন

python3 tools/check-dark-gaps.py deck.pdf

প্রতিবেশী টেক্সটের খুব কাছাকাছি থাকা ডায়াগ্রাম বা বাক্স খুঁজে পেতে এই যাচাইকরণ ব্যবহার করুন।

চিত্রের ভেতরের টেক্সট যাচাই করুন

python3 tools/check-figure-text.py deck.pdf

এই যাচাইকরণটি চিত্রের ভেতরের ছোট টেক্সট এবং বাক্সের প্রান্তের সঙ্গে অতিরিক্ত ঘেঁষে থাকা টেক্সট শনাক্ত করে।

SVG বাক্সে ফিট যাচাই করুন

node tools/check-svg-box-fit.mjs images/*.svg

এই যাচাইকরণটি SVG বাক্সের ভেতরের টেক্সট বাক্সগুলোর মধ্যে ঠিকমতো ফিট করছে কি না পরীক্ষা করে। চিত্রগুলো স্লাইড Markdown থেকে আলাদাভাবে তৈরি বা সম্পাদনা করা হলে এটি বিশেষভাবে কার্যকর।

পুনর্ব্যবহৃত স্লাইড যাচাই করুন

python3 tools/check-reuse-diff.py new.md old.md

স্লাইড পুনর্ব্যবহার করার সময় এই তুলনাটি চালান। এটি নতুন ও পুরোনো Markdown ফাইলের শিরোনাম এবং চিত্রের মধ্যকার সম্পর্ক পরীক্ষা করে, ফলে পুনর্ব্যবহৃত ভিজ্যুয়াল কনটেন্ট আশপাশের বার্তার সঙ্গে আর সামঞ্জস্যপূর্ণ না থাকলে তা বুঝতে সাহায্য করে।

ইলাস্ট্রেশন যোগ করুন

নমুনা প্রেজেন্টেশনে প্রায়ই Irasutoya-এর ইলাস্ট্রেশন ব্যবহার করা হয়, তবে সেই ছবিগুলো রিপোজিটরিতে অন্তর্ভুক্ত নেই। নমুনা ডেক রপ্তানির আগে সেগুলো ডাউনলোড করুন:

sh examples/sample/fetch-illustrations.sh

ডাউনলোড করা কোনো ইলাস্ট্রেশন ব্যবহারের আগে প্রযোজ্য ব্যবহারের শর্তগুলো নিজে যাচাই করুন। নমুনা ডেকের ওভারভিউতে দেখানো ইলাস্ট্রেশনগুলো Irasutoya-এর কপিরাইটযুক্ত কাজ এবং এই রিপোজিটরির Apache License 2.0-এর আওতাভুক্ত নয়।

AI-সহায়িত একটি ব্যবহারিক কর্মপ্রবাহ

1. গল্প দিয়ে শুরু করুন। হুক, বিভাগগুলোর রূপান্তর, ধারণাগুলোর ধাপে ধাপে উপস্থাপন, শিরোনামের ধরন, সমাপ্তি এবং আনুমানিক বলার সময় নির্ধারণ করতে AI এজেন্টকে slide-story নির্দেশনা ব্যবহার করতে বলুন।
2. চিত্রগুলোর পরিকল্পনা করুন। প্রতিটি ডায়াগ্রামকে শ্রোতাদের জন্য প্রয়োজনীয় তথ্যে সীমিত করতে, পাঠযোগ্য টেক্সটের আকার বেছে নিতে এবং SVG নাকি ইলাস্ট্রেশন উপযুক্ত তা নির্ধারণ করতে slide-figures ব্যবহার করুন।
3. ভিজ্যুয়াল সিস্টেম প্রয়োগ করুন। সাদা স্থান, উল্লম্ব ভারসাম্য, গাঢ় পটভূমিতে কনট্রাস্ট এবং টেবিল ও কোডের সামঞ্জস্যপূর্ণ স্টাইল বজায় রাখতে slide-design-dark ও minorun-dark.css ব্যবহার করুন।
4. দ্রুত এক্সপোর্ট করুন। শুধু Markdown সোর্স বা এডিটর প্রিভিউয়ের ওপর নির্ভর না করে Marp দিয়ে একটি PDF তৈরি করুন।
5. আউটপুট পরীক্ষা করুন। PDF ও SVG যাচাই চালান, তারপর চিত্রের গাদাগাদি লেবেল, দুর্বল স্পেসিং বা প্রান্তের অতিরিক্ত ব্যবহারের মতো প্রকৃত রেন্ডারিং সমস্যার ভিত্তিতে স্লাইড সংশোধন করুন।
6. পুরো বক্তব্যটি পর্যালোচনা করুন। ডেকটির অগ্রগতি সুসংগত কি না এবং প্রতিটি চিত্র সংশ্লিষ্ট স্লাইডের শিরোনামকে সমর্থন করছে কি না নিশ্চিত করুন, কেবল সাজসজ্জা হিসেবে ব্যবহৃত হচ্ছে কি না তা নয়।

উন্নত টিপস

ভাঙা উদাহরণকে রিগ্রেশন টেস্ট হিসেবে ব্যবহার করুন

examples/broken ডিরেক্টরিতে ইচ্ছাকৃতভাবে সমস্যাযুক্ত একটি ডেক রাখা হয়েছে। পরিদর্শন স্ক্রিপ্টগুলো সঠিকভাবে ইনস্টল হয়েছে কি না এবং যেসব লেআউট সমস্যা শনাক্ত করার জন্য এগুলো তৈরি করা হয়েছে, সেসব সমস্যায় এগুলো সাড়া দেয় কি না তা যাচাই করতে এটি ব্যবহার করুন।

শুধু সোর্স Markdown নয়, PDF যাচাই করুন

Marp রেন্ডারিং সোর্স কোডে দৃশ্যমান নয় এমন সমস্যাও প্রকাশ করতে পারে, যার মধ্যে ফন্টের প্রাপ্যতা, বক্স সাইজিং, স্থানীয় অ্যাসেট এবং চূড়ান্ত পেজ লেআউটের কারণে সৃষ্ট পরিবর্তন অন্তর্ভুক্ত। এক্সপোর্ট করা PDF-কে পরিদর্শনের প্রধান আর্টিফ্যাক্ট হিসেবে বিবেচনা করুন।

চিত্রের টেক্সট পাঠযোগ্য রাখুন

কোনো ডায়াগ্রামে অতিরিক্ত তথ্য থাকলে, টেক্সট ছোট করার পরিবর্তে প্রথমে বিস্তারিত অংশ সরিয়ে ফেলুন বা পরে উপস্থাপনের জন্য রাখুন। লাইভ উপস্থাপনার সময় ডায়াগ্রাম পাঠযোগ্য রাখতে চিত্রের নির্দেশনা এবং check-figure-text.py একসঙ্গে কাজ করে।

শিরোনাম ও চিত্রের সামঞ্জস্য রাখুন

আগের কোনো স্লাইড পুনর্ব্যবহার করলে তার শিরোনাম এবং ভিজ্যুয়াল ব্যাখ্যা দুটিই আপডেট করুন। স্লাইডের বার্তা বদলে গেলেও পুরোনো চিত্র রয়ে গেছে এমন পরিস্থিতি শনাক্ত করতে reuse-diff যাচাই সাহায্য করে।

লাইসেন্সের সীমা মনে রাখুন

রিপোজিটরিটি Apache License 2.0-এর অধীনে প্রকাশিত, যেখানে কপিরাইট Minoru Onda-এর নামে স্বীকৃত। বাহ্যিক ফন্ট ও ইলাস্ট্রেশনের আলাদা শর্ত থাকতে পারে, তাই ডেক বিতরণের আগে সেগুলোর লাইসেন্স স্বাধীনভাবে যাচাই করুন।

উপসংহার

minorun-marp-skill Marp-এর জন্য উপস্থাপনা-সংক্রান্ত পরামর্শকে পুনর্ব্যবহারযোগ্য AI এজেন্ট স্কিল, একটি গাঢ় থিম, উদাহরণ এবং নির্দিষ্ট আউটপুট যাচাইয়ের সমন্বয়ে রূপ দেয়। স্কিলগুলো Claude Code-এ কপি করুন, থিম ও টুলগুলো আপনার ডেকের পাশে রাখুন, Marp দিয়ে এক্সপোর্ট করুন এবং রেন্ডার করা PDF ও SVG ফাইল পরীক্ষা করুন। এই কর্মপ্রবাহ বর্ণনা, ডায়াগ্রাম ও ভিজ্যুয়াল ডিজাইনকে একসঙ্গে কার্যকর রাখতে সাহায্য করে, স্লাইডের পরিশীলনকে শেষ মুহূর্তের কাজ হিসেবে বিবেচনা না করে।