Front end چیست؟
فرانت اند یا Front End ، به قسمت قابل مشاهده وب سایت (نرم افزار) توسط کاربران می‌گویند. فرانت اند کدهای غیر قابل فهم برای کاربران را در قالب ظاهری گرافیکی و بصری به آن‌ها نمایش می‌دهد تا بتواند به راحتی از بخش‌های مختلف سایت استفاده کنند. در این بخش فرم‌های ورودی اطلاعات، صداها، تصاویر، ویدیوها و به صورت کلی هر چیز دیگری که برای کاربر قابل درک باشد، قرار می‌گیرد. فرانت اند به دو بخش اصلی طراحی وب و توسعه رابط کاربری تقسیم میشود.
در بخش طراحی وب، طراحان با نرم افزارهای گرافیکی مانند فتوشاپ ظاهر سایت را طراحی می‌کنند. اما بخش توسعه رابط کاربری مربوط به پیاده سازی ظاهر سایت در قالب کدهای HTML ،CSS و Javascript است. زبان‌های برنامه نویسی که در فرانت به کار می‌روند، سمت کاربر یا Client Side می‌باشند. بنابراین کدهای نوشته شده در فرانت در مرورگر کاربر پردازش و اجرا می‌شوند. یعنی کاربر به راحتی به این کدها دسترسی مستقیم دارد و می‌تواند آن‌ها را مشاهده کند. فرانت اند با بخش بک اند (Backend) در ارتباط مستقیم است و تاثیر بسیاری بر روی تجربه کاربری (UX) دارد.
مراحل کار برای خدمات فرانت اند ابتدا با مشتری مصاحبه اولیه انجام می شود و لیست نیاز های مشتری در قابل یک RFP تهیه می شود در ادامه براساس RFP و موارد مورد نیاز مشتری وایرفریم صفحات تهیه میشود و براساس نیاز ارتباط این صفحات نیز مشخص می شود پس از تایید مشتری براساس Wire-frame d یک Prototype گرافیکی روی پلت فرم Adobe XD و یا Figmaبسته به رد خواست مشتری طراحی و پس از تایید مشتری فرآیند تهیه کد محصول شروع می شود .
Front end چیست؟
فرانت اند یا Front End ، به قسمت قابل مشاهده وب سایت (نرم افزار) توسط کاربران می‌گویند. فرانت اند کدهای غیر قابل فهم برای کاربران را در قالب ظاهری گرافیکی و بصری به آن‌ها نمایش می‌دهد تا بتواند به راحتی از بخش‌های مختلف سایت استفاده کنند. در این بخش فرم‌های ورودی اطلاعات، صداها، تصاویر، ویدیوها و به صورت کلی هر چیز دیگری که برای کاربر قابل درک باشد، قرار می‌گیرد. فرانت اند به دو بخش اصلی طراحی وب و توسعه رابط کاربری تقسیم میشود.
در بخش طراحی وب، طراحان با نرم افزارهای گرافیکی مانند فتوشاپ ظاهر سایت را طراحی می‌کنند. اما بخش توسعه رابط کاربری مربوط به پیاده سازی ظاهر سایت در قالب کدهای HTML ،CSS و Javascript است. زبان‌های برنامه نویسی که در فرانت به کار می‌روند، سمت کاربر یا Client Side می‌باشند. بنابراین کدهای نوشته شده در فرانت در مرورگر کاربر پردازش و اجرا می‌شوند. یعنی کاربر به راحتی به این کدها دسترسی مستقیم دارد و می‌تواند آن‌ها را مشاهده کند. فرانت اند با بخش بک اند (Backend) در ارتباط مستقیم است و تاثیر بسیاری بر روی تجربه کاربری (UX) دارد.
مهارت‌های مورد استفاده در فرآیند طراحی فرانت اند
حال که متوجه شدید که فرانت اند چیست و ما چطور عمل می کنیم ، در این بخش می‌خواهیم مهارت‌های توسعه دهنده فرانت اند جهت آشنایی بیشتر شما توضیح بدیم:
- زبان HTML : یک زبان برنامه نویسی نیست بلکه یک زبان نشانه گذاری است که به عنوان هسته و بدنه اصلی صفحات وب به حساب می‌آید. این زبان برای ایجاد ساختار صفحات وب استفاده میشود.
- زبان CSS : مخفف عبارت Cascading Style Sheets است که به منظور فرم دهی صفحات وب و اجزای مختلف صفحات وب سایت مانند متن، تصویر، کادرها و … ساخته شده است. CSS طراحان سایت را قادر می‌سازد که بدون محدودیت خلاقیت‌های خود را در طراحی صفحات سایت پیاده سازی کنند.
- زبان برنامه نویسی Javascript : این زبان برنامه نویسی در سمت کاربر پردازش میشود. برنامه نویس فرانت اند به کمک Javascript می‌تواند به پویانمایی صفحاتی که با HTML و CSS طراحی کرده است بپردازد.
- کتابخانه‌ها و فریم ورک‌های فرانت اند Javascript : فریم ورک‌های Javascript امکانات بسیار زیادی و پشرفته ای را در اختیار طراحان فرانت قرار می‌دهند. از جمله این فریمورک‌ها می‌توان به Vu.js، Angular و… اشاره کرد.
- اصول طراحی واکنشگرا: یک رابط کاربری استاندارد باید به گونه ای باشد که در دستگاه‌ها و پلتفرم‌های مختلف، عملکرد اپلیکیشن را دچار اختلال نکند. بنابراین باید بتواند متناسب با نوع دستگاهی که در حال اجرای آن است، واکنش مناسب نشان دهد.
- نرم افزارهای گرافیکی مانند فتوشاپ : نرم افزارهای گرافیکی مانند فتوشاپ، ایلوستریتور و… در بیشتر مراحل طراحی یک رابط کاربری توسط طراحان فرانت مورد استفاده قرار می‌گیرند.
- سلیقه و خلاقیت : طراح فرانت اند باید از طرح هایی خلاقانه، کاربرپسند و چشم نواز برای ظاهر یک اپلیکیشن استفاده کند. یک طراح موفق کسی است که بتواند رابط کاربری زیبا منطق بر استانداردهای ظاهری و تجربه کاربری ایجاد کند.
- آشنایی با اصول تجربه کاربری : توسعه دهنده فرانت باید به خوبی نیازهای کاربران را بشناسد. او باید بتواند رابط کاربری یک اپلیکیشن را به گونه ای طراحی کند که کاربران بهترین تجربه را از استفاده از آن به دست آورند.
مشتاقانه منتظر تماس شما برای شروع همکاری با هم هستیم.