Figma থেকে Linear: কপি-পেস্ট ছাড়াই ডিজাইন আর ডেভেলপমেন্টের সেতুবন্ধন
নেটিভ এমবেড, Figma প্লাগইন, এবং ডিজাইন ও ইঞ্জিনিয়ারিংকে সিঙ্কে রাখে এমন ওয়ার্কফ্লো প্যাটার্ন ব্যবহার করে Figma-কে Linear-এর সাথে কীভাবে ইন্টিগ্রেট করবে।
By Chris Calo · 2026-03-15
গত বছরের কোনো এক সময়, ডিজাইন-থেকে-ইঞ্জিনিয়ারিং হ্যান্ডঅফ কর্মক্ষেত্রের থিয়েটারের একটি জনরায় পরিণত হয়েছে। একজন ডিজাইনার Figma-তে একটি কম্পোনেন্ট শেষ করে, তিনটি সযত্নে লেখা কমেন্ট রাখে, Slack-এ একটি লিংক পেস্ট করে, আর যে ইঞ্জিনিয়ার বানাবে তাকে ট্যাগ করে। ইঞ্জিনিয়ার দুদিন পর লিংকটি খোলে, তিনটির মধ্যে দুটি কমেন্ট পড়ে, একটি ভ্যারিয়েন্ট মিস করে, আর "মোটামুটি কাছাকাছি" কিছু শিপ করে যা QA পর্যন্ত কেউ খেয়াল করে না।
তুমি যদি এই বিশেষ ধরনের ভুল বোঝাবুঝির মধ্যে দিয়ে গিয়ে থাকো (আমি গেছি, বারবার), তুমি আগেই জানো এর সমাধান "আরও ভালো যোগাযোগ" নয়। সমাধান হলো টুলগুলোকে কানেক্ট করা যাতে কনটেক্সট কাজের সাথে সাথে চলে। এখানে দেখানো হচ্ছে কীভাবে Figma-কে Linear-এর সাথে ইন্টিগ্রেট করবে – নেটিভ এমবেড, প্লাগইন, এবং সেই তিনটি ওয়ার্কফ্লো প্যাটার্ন যা আসলেই কানেকশনকে কাজের করে তোলে।
Linear-এর Figma ইন্টিগ্রেশন আসলে কী করে
Linear বেশ কিছুদিন ধরেই Figma এমবেড সাপোর্ট করে, আর বেসিকগুলো শক্ত। যেকোনো ইস্যু description বা কমেন্টে একটি Figma URL পেস্ট করো, এবং Linear ডিজাইনের একটি এমবেডেড প্রিভিউ তৈরি করে। এই প্রিভিউগুলো ডিফল্টে স্ট্যাটিক – Linear এমবেডিংয়ের মুহূর্তে সেগুলো ফ্রিজ করে কনটেক্সট সংরক্ষণ করতে, যা একটি ইচ্ছাকৃত সিদ্ধান্ত। তুমি এডিট মোডে ম্যানুয়ালি রিফ্রেশ করতে পারো, কিন্তু ডিজাইন তোমার অজান্তেই আপডেট হবে না।
তুমি Figma লিংকগুলো ইস্যু অ্যাটাচমেন্ট হিসেবেও যোগ করতে পারো, যা সাইডবারে সাজানো থাকে বৃহস্পতিবারের মধ্যে চল্লিশ মেসেজে পরিণত হওয়া কমেন্ট থ্রেডে চাপা পড়ার বদলে।
Figma Linear ইন্টিগ্রেশন যা করে না তা হলো দ্বিমুখী কিছু। Linear Figma দেখে, কিন্তু Figma Linear দেখে না। কমেন্ট যেখানে লেখা হয়েছে সেখানেই থাকে। স্ট্যাটাস পরিবর্তন প্রচারিত হয় না। ইঞ্জিনিয়ার যদি Linear-এ একটি ইস্যু "Done" মার্ক করে, Figma-তে কেউ জানে না যদি না কেউ বলে – যার মানে, প্র্যাকটিসে, Figma-তে কেউ জানে না।
Figma-কে Linear-এর সাথে কীভাবে ইন্টিগ্রেট করবে: ধাপে ধাপে
সেটআপ সোজাসাপ্টা (ভাগ্যক্রমে – সবকিছুতে বারো-ধাপের OAuth নাচের দরকার নেই!)।
ধাপ ১: ইন্টিগ্রেশন এনাবল করো
তোমার Linear ওয়ার্কস্পেস সেটিংসে যাও, তারপর Integrations। লিস্টে Figma খুঁজে Enable ক্লিক করো। কানেকশন অথরাইজ করতে Figma-তে রিডাইরেক্ট হবে। অ্যাক্সেস দাও, ব্যস, অ্যাডমিন পাশ শেষ।
ধাপ ২: ফ্রেম ইস্যুর সাথে লিংক করো
এনাবল হলে, যেকোনো Figma URL Linear ইস্যুতে পেস্ট করলে এমবেডেড প্রিভিউ তৈরি হয়। সেরা ফলাফলের জন্য:
- নির্দিষ্ট ফ্রেম লিংক করো, পুরো ফাইল নয়।
figma.com/file/abc123?node-id=42:1337-এ লিংক করলে প্রাসঙ্গিক কম্পোনেন্ট দেখায়। figma.com/file/abc123-এ লিংক করলে Figma যা ডিফল্ট ভিউ মনে করে সেটি দেখায়, যা সাধারণত তোমার কাজের জিনিস না।
- ইস্যু description-এ প্রাইমারি ডিজাইন রেফারেন্স দাও। কমেন্ট ইটারেশনের জন্য কাজ করে, কিন্তু ইঞ্জিনিয়াররা ইস্যু নেওয়ার সময় description প্রথমে পড়ে।
- ইস্যু স্প্রিন্টে ঢোকার আগে Figma লিংক যোগ করো। এটি স্পষ্ট শোনায়, কিন্তু আমি সত্যিই অবাক হই কত ঘন ঘন ডিজাইন কনটেক্সট যোগ হয় ইঞ্জিনিয়ার ইতিমধ্যে বিশ মিনিট খোঁজাখুঁজি করার পরে।
ধাপ ৩: Figma প্লাগইন ইনস্টল করো
Figma-তে একটি Linear প্লাগইন আছে যা ডিজাইনারদের সরাসরি ক্যানভাস থেকে Linear ইস্যু তৈরি ও আপডেট করতে দেয়। একটি ফ্রেম সিলেক্ট করো, প্লাগইন ওপেন করো, ইস্যু টাইটেল আর টিম পূরণ করো, এবং Figma লিংক আগে থেকেই অ্যাটাচ করা ইস্যু তৈরি হয়ে যায়। প্লাগইন Figma না ছেড়েই ইস্যু স্ট্যাটাস আর অ্যাসাইনি আপডেটও সাপোর্ট করে।
এটি ডিজাইন থেকে ডেভেলপমেন্ট হ্যান্ডঅফকে "ইঞ্জিনিয়ার ডিজাইন খুঁজতে যায়" থেকে "ডিজাইনার ডিজাইন ইঞ্জিনিয়ারিংয়ে পাঠায়"-এ ফ্লিপ করে। আমাদের টিমের অভিজ্ঞতায়, শুধু এই একটি পরিবর্তনই "এই ইস্যুর ডিজাইনটা কোথায়?" Slack মেসেজ প্রায় অর্ধেকে নামিয়ে এনেছে। বিশ্বাস করো, শুধু এটার জন্যই পাঁচ মিনিটের সেটআপ করা মূল্যবান!
নেটিভ ইন্টিগ্রেশন কোথায় কম পড়ে
Linear আর Figma যা তৈরি করেছে তা আমি কম দেখাতে চাই না – হালকা কানেকশনের জন্য এটি কাজ করে। কিন্তু কিছু ফাঁক নাম ধরে বলা দরকার, কারণ সেগুলো নেই ভান করলে তিন মাস পর "আমাদের ইন্টিগ্রেশন আছে, তাহলে কিছু সিঙ্ক হচ্ছে না কেন?" কথোপকথন হয়।
কমেন্ট পার হয় না। ডিজাইনার Figma-তে ফিডব্যাক দিলে আর ইঞ্জিনিয়ার Linear-এ রেসপন্ড করলে, কেউই অন্যজনের রেসপন্স দেখে না দুটো টুল ম্যানুয়ালি চেক না করলে। আমাদের অভিজ্ঞতায়, এই কমেন্ট সাইলোই ডিজাইন-থেকে-ডেভ ভুল বোঝাবুঝির মূল উৎস – খারাপ স্পেক নয়, বরং দুটো জায়গায় একসাথে চলা আলোচনা।
স্ট্যাটাস একমুখী। Linear-এ একটি ইস্যু "In Progress"-এ গেলে Figma-তে কিছু আপডেট হয় না। ডিজাইনারকে Linear চেক করতে হয় (বা বাস্তবে, Slack-এ জিজ্ঞেস করতে হয়) জানতে তার ডিজাইনগুলো বানানো হচ্ছে কি না।
পরিবর্তনের নোটিফিকেশন নেই। ডিজাইনার যখন Linear ইস্যুর সাথে লিংক করা একটি ফ্রেম আপডেট করে, ইস্যুতে অ্যাসাইন করা ইঞ্জিনিয়ার Linear-এ কোনো অ্যালার্ট পায় না। প্রিভিউ ডিফল্টে স্ট্যাটিক বলে, ইঞ্জিনিয়ার হয়তো ডিজাইনের এমন ভার্সনের ওপর বিল্ড করছে যা ইতিমধ্যে রিভাইজ হয়ে গেছে। কেউ ম্যানুয়ালি এমবেড রিফ্রেশ না করলে বা Slack-এ না বললে, আপডেটটি অদৃশ্য।
ফাঁকগুলো পূরণ করে এমন ওয়ার্কফ্লো প্যাটার্ন
এমবেড রেফারেন্স সমস্যার সমাধান করে। এই তিনটি প্যাটার্ন কোঅর্ডিনেশন সমস্যার সমাধান করে – আর এগুলোই নির্ধারণ করে তোমার Figma Linear ইন্টিগ্রেশন আসলেই হ্যান্ডঅফ উন্নত করে কি না, নাকি শুধু আরেকটি টুল কানেকশন যোগ হলো যা কেউ মেইনটেইন করে না।
প্যাটার্ন ১: Design-Ready ইস্যু
একটি ডিজাইন ইস্যু স্প্রিন্ট ব্যাকলগে ঢোকার আগে Linear-এ তিনটি জিনিস অ্যাটাচ থাকা দরকার:
- Figma ফ্রেম লিংক (নির্দিষ্ট ফ্রেম, ফাইল নয়)
- ডিজাইন নোট যা শেষ ইটারেশন থেকে কী পরিবর্তন হয়েছে তার সারসংক্ষেপ (কারণ এমবেডেড প্রিভিউ বর্তমান অবস্থা দেখায়, কী নতুন তা নয়)
- Acceptance criteria যা নির্দিষ্টভাবে ডিজাইন রেফার করে – "Figma ফ্রেমের মতো হবে" acceptance criteria নয়। "কার্ড টাইটেল আর সাবটাইটেলের মাঝে 8px স্পেসিং টোকেন ব্যবহার করবে" – এটি acceptance criteria।
ইস্যু প্রতি ডিজাইনারের কিছু অতিরিক্ত মিনিট। কিন্তু ফলাফল হলো ইঞ্জিনিয়াররা Slack আর্কিওলজি এক্সপিডিশন ছাড়াই বিল্ড শুরু করতে পারে।
প্যাটার্ন ২: Design Review লেবেল
Linear-এ একটি কাস্টম লেবেল তৈরি করো – "Needs Design Review" এরকম কিছু – আর ইস্যু বিল্ড হওয়ার পর ডিজাইনারকে ইমপ্লিমেন্টেশন ভেরিফাই করতে হলে এটি অ্যাপ্লাই করো। ট্রিক (আর আমি জানি এটা বিরক্তিকর রকম স্পষ্ট) হলো এটাকে ইস্যু লাইফসাইকেল টেমপ্লেটের অংশ করা যাতে ইস্যু "In Review"-তে গেলে স্বয়ংক্রিয়ভাবে ট্রিগার হয়। অভিজ্ঞতা থেকে বলছি – আমরা ঠিক এই লেবেলটি তৈরি করেছিলাম, দুই স্প্রিন্ট ধর্মীয়ভাবে ব্যবহার করেছিলাম, তারপর চুপচাপ বন্ধ করে দিয়েছিলাম কারণ কেউ টেমপ্লেট করেনি। শুরুতে যে ইঞ্জিনিয়ারের কথা বলেছিলাম যে একটি ভ্যারিয়েন্ট মিস করে "মোটামুটি কাছাকাছি" শিপ করেছিল? সেটা ছিল মিসিং design review লেবেল।
প্যাটার্ন ৩: Sprint Map হিসেবে Figma সেকশন
বড় প্রজেক্টের জন্য, বর্তমান স্প্রিন্টের ডিজাইনের জন্য একটি Figma সেকশন বা পেজ ডেডিকেট করো। প্রতিটি ফ্রেম ঠিক একটি Linear ইস্যুর সাথে ম্যাপ করে। ফ্রেমের নাম ইস্যু আইডেন্টিফায়ারের সাথে মিলিয়ে দাও – ENG-142 – Card Component Redesign – যাতে ইঞ্জিনিয়ারদের "Frame 247" নামের চল্লিশটি আর্টবোর্ড স্ক্রল না করতে হয়।
এই অভ্যাসগুলো টিকিয়ে রাখা
যেসব টিমে আমি এটি কাজ করতে দেখেছি তাদের কিছু কমন বৈশিষ্ট্য আছে: ডিজাইনাররা ইস্যু স্প্রিন্টে ঢোকার আগে ফ্রেম লিংক করে (ইঞ্জিনিয়ারদের অভিযোগের পরে নয়), ইঞ্জিনিয়াররা ইস্যু done মার্ক করার আগে review লেবেল অ্যাপ্লাই করে (পরে মনে পড়লে নয়), আর কেউ Slack-কে ডিজাইন সিদ্ধান্তের সিস্টেম অফ রেকর্ড হিসেবে ট্রিট করে না।
শেষেরটা যেকোনো ইন্টিগ্রেশনের চেয়ে বেশি গুরুত্বপূর্ণ, আর তুমি যদি কখনো পনেরো মিনিট খরচ করে থাকো "সেই থ্রেডটা যেখানে আমরা border radius বদলানোর সিদ্ধান্ত নিয়েছিলাম" খুঁজতে, তুমি ঠিক জানো আমি কী বলতে চাইছি। Slack-এ ডিজাইন আলোচনা হয়, আর Slack-এই সেগুলো হারিয়ে যায়। কোনো ডিজাইন সিদ্ধান্ত যদি থ্রেডে হয়ে থাকে, কাউকে Figma ফাইল বা Linear ইস্যু আপডেট করতে হবে – নাহলে তিন সপ্তাহে সেটা চলে যাবে, ডিপ্লয়মেন্ট অ্যালার্ট আর লাঞ্চ প্ল্যানের নিচে চাপা পড়ে।
"কোনো ডিজাইন সিদ্ধান্ত যদি থ্রেডে হয়ে থাকে, কাউকে Figma ফাইল বা Linear ইস্যু আপডেট করতে হবে – নাহলে তিন সপ্তাহে সেটা হারিয়ে যাবে, ডিপ্লয়মেন্ট অ্যালার্ট আর লাঞ্চ প্ল্যানের নিচে চাপা পড়ে।" – Chris Calo
নেটিভ Figma-Linear ইন্টিগ্রেশন এমবেডিং আর রেফারেন্স ভালো সামলায়। দ্বিমুখী সচেতনতার জন্য – কমেন্ট, স্ট্যাটাস, পরিবর্তনের নোটিফিকেশন – তোমার দরকার হয় ম্যানুয়াল শৃঙ্খলা অথবা এমন একটি লেয়ার যা স্বয়ংক্রিয়ভাবে দুটো টুলের কনটেক্সট কানেক্ট করে।
আর তুমি যদি শুধু Figma আর Linear নয় – Slack, GitHub আর Notion-ও যোগ করছো – সবকিছু সিঙ্কে রাখার ম্যানুয়াল ওভারহেড দ্রুত বাড়ে। সেটি আলাদা আলোচনা, কিন্তু পরবর্তী "কে এই ডিজাইন বদলেছে আর কেউ কেন বলল না?" পোস্ট-মর্টেমের আগেই এটি করা দরকার।
This integration sits within a unified workflow across Linear, GitHub, Figma, and Slack – see that article for the full toolchain picture. The specific problem of comment routing is covered in the Figma-to-Linear feedback loop. For a broader view of what makes handoffs succeed, what a complete design-to-engineering handoff actually requires goes beyond the integration setup.
Figma, Linear, Slack আর GitHub-কে একটি নলেজ গ্রাফে কানেক্ট করো – যাতে ডিজাইন কনটেক্সট কাজের সাথে সাথে চলে।
Q: Sugarbug কি স্বয়ংক্রিয়ভাবে Figma আর Linear কানেক্ট করে? A: হ্যাঁ। Sugarbug Figma আর Linear উভয় থেকে সিগন্যাল ইনজেস্ট করে, ডিজাইন কমেন্ট আর ফাইল আপডেটকে তার নলেজ গ্রাফে ইস্যু স্ট্যাটাস পরিবর্তনের সাথে কোরিলেট করে। কোনো ডিজাইনার ফ্রেমে ফিডব্যাক দিলে, Sugarbug কাউকে URL কপি না করেই সেটি সংশ্লিষ্ট Linear ইস্যুর পাশে তুলে ধরতে পারে।
Q: Sugarbug কি Figma, Linear আর Slack জুড়ে ডিজাইন হ্যান্ডঅফ ট্র্যাক করতে পারে? A: Sugarbug Figma, Linear, Slack, GitHub আর Notion-কে একটি একক নলেজ গ্রাফে কানেক্ট করে। ডিজাইন ফিডব্যাক, ইঞ্জিনিয়ারিং আলোচনা আর টাস্ক স্ট্যাটাস সব কোরিলেটেড থাকে – তাই হ্যান্ডঅফের সময় কনটেক্সট হারিয়ে যায় না।
Q: Linear-এ কি বিল্ট-ইন Figma ইন্টিগ্রেশন আছে? A: হ্যাঁ। Linear-এর নেটিভ Figma ইন্টিগ্রেশন তোমাকে ইস্যুতে Figma URL পেস্ট করে এমবেডেড প্রিভিউ তৈরি করতে দেয়, এবং Figma প্লাগইন দিয়ে ক্যানভাস থেকে সরাসরি ইস্যু তৈরি বা আপডেট করতে দেয়। তবে এটি একমুখী – কমেন্ট আর স্ট্যাটাস পরিবর্তন দুই টুলের মধ্যে সিঙ্ক হয় না।
Q: একটি Figma ফ্রেমকে Linear ইস্যুর সাথে কীভাবে লিংক করবে? A: Figma ফ্রেমের URL-টি Linear ইস্যুর description বা কমেন্টে পেস্ট করো। Linear একটি এমবেডেড প্রিভিউ তৈরি করবে। তুমি Linear-এর Figma প্লাগইনও ব্যবহার করতে পারো ক্যানভাস থেকে সরাসরি ইস্যু তৈরি করতে, যেখানে লিংক আগে থেকেই অ্যাটাচ থাকবে।
Q: কেন Figma-র কমেন্ট Linear-এ দেখা যায় না? A: Linear-এর নেটিভ Figma ইন্টিগ্রেশন ডিজাইন প্রিভিউ এমবেড করে কিন্তু দুই টুলের মধ্যে কমেন্ট সিঙ্ক করে না। একজন ডিজাইনারের Figma কমেন্ট আর একজন ইঞ্জিনিয়ারের Linear কমেন্ট আলাদা সাইলোতে থাকে। Sugarbug-এর মতো টুল এই ফাঁক পূরণ করে – উভয় থেকে সিগন্যাল ইনজেস্ট করে একটি শেয়ারড নলেজ গ্রাফে লিংক করে।