نحوه گرد کردن گوشه های تیز در فتوشاپ نحوه گرد کردن گوشه های تصویر با فتوشاپ

گوشه های مستطیلی سنتی در طراحی سایت مدت هاست که همه را خسته کرده است. گوشه های گرد در مد هستند، که نه با کمک تصاویر، بلکه از طریق سبک ها ساخته می شوند، که برای آنها از ویژگی حاشیه-radius استفاده می شود. این ویژگی می تواند دارای یک، دو، سه یا چهار مقدار با فاصله باشد که شعاع تمام گوشه ها یا هر یک را به صورت جداگانه تعیین می کند.

روی میز. 1 تعداد متفاوتی از مقادیر و نوع بلوکی که در این مورد به دست می آید را نشان می دهد.

کد	شرح	چشم انداز
div (شعاع مرزی: 10 پیکسل؛ )	شعاع گرد کردن همه گوشه ها به طور همزمان.
div (شعاع مرزی: 0 10 پیکسل؛ )	مقدار اول شعاع گوشه سمت راست بالا و پایین را تعیین می کند، مقدار دوم گوشه سمت راست بالا و پایین سمت چپ را تنظیم می کند.
div (شعاع حاشیه: 20 پیکسل 10 پیکسل 0؛ )	مقدار اول شعاع گوشه سمت چپ بالا را تعیین می کند، مقدار دوم شعاع گوشه سمت راست بالا و پایین سمت چپ را به طور همزمان تنظیم می کند و مقدار سوم گوشه پایین سمت راست را تعیین می کند.
div (شعاع حاشیه: 20 پیکسل 10 پیکسل 5 پیکسل 0؛ )	به صورت متوالی شعاع گوشه سمت چپ بالا، سمت راست بالا، پایین سمت راست و پایین سمت چپ را تنظیم می کند.

مثال 1 نحوه ایجاد یک بلوک با گوشه های گرد را نشان می دهد.

مثال 1. گوشه ها را مسدود کنید

HTML5 CSS3 IE 9+ Cr Op Sa Fx

نتیجه این مثال در شکل نشان داده شده است. 1.

برنج. 1. بلوک با گوشه های گرد

با تنظیم شعاع گرد بر روی بیش از نیمی از ارتفاع و عرض عنصر می توان یک اثر جالب به دست آورد. در این حالت، یک دایره دریافت می کنید. مثال 2 نحوه ایجاد یک دکمه گرد با یک تصویر را نشان می دهد.

مثال 2: دکمه گرد

HTML5 CSS3 IE 9+ Cr Op Sa Fx

نتیجه این مثال در شکل نشان داده شده است. 2.

برنج. 2. دکمه گرد

در مرورگر Opera، گرد کردن به اگر هیچ حاشیه ای از طریق ویژگی border تنظیم نشده باشد، به اشتباه اعمال می شود.

ویژگی border-radius همچنین می تواند با ویژگی های دیگر مانند افزودن سایه به یک عنصر ترکیب شود. مثال 3 مجموعه ای از دایره ها را ساخته است که یکی از آنها با box-shadow برجسته شده است. از چنین مجموعه ای می توان برای پیمایش صفحات یا عکس ها استفاده کرد.

مثال 3 درخشش

HTML5 CSS3 IE 9+ Cr Op Sa Fx

نتیجه این مثال در شکل نشان داده شده است. 3.

برنج. 3. در اطراف دایره بدرخشید

با کمک شعاع مرزی، می توانید نه تنها یک دایره، بلکه یک بیضی و همچنین یک گرد بیضی شکل روی بلوک ایجاد کنید. برای انجام این کار، باید نه یک مقدار، بلکه دو مقدار را از طریق اسلش بنویسید. نوشتن 20px/10px به این معنی است که شعاع افقی 20 پیکسل و به صورت عمودی 10 پیکسل خواهد بود. مثال 4 نحوه ایجاد گوشه های بیضوی برای افزودن شرح کتاب کمیک به عکس را نشان می دهد.

مثال 4. بیضی

HTML5 CSS3 IE 9+ Cr Op Sa Fx

تو معلم خودت هستی

نتیجه این مثال در شکل نشان داده شده است. 4.

برنج. 4. استفاده از گوشه های بیضوی

همانطور که در مثال 5 نشان داده شده است می توانید با افزودن ویژگی border-radius به انتخابگر img ظاهر گوشه های تصاویر را تغییر دهید.

مثال 5 تصاویر

HTML5 CSS3 IE 9+ Cr Op Sa Fx

در این مقاله کوتاه به بررسی نمونه ای از ایجاد یک قاب "نازک" در فتوشاپ با ضخامت 1 - 2 پیکسل با لبه های گرد. این فریم‌ها (و قطعات آن‌ها) به طور گسترده توسط طراحان و مدیران وب‌سایت هنگام چیدمان طرح‌بندی و ایجاد قالب برای وب‌سایت‌ها استفاده می‌شوند. از آنها برای قاب بندی مقالات، منوها، دکمه ها و غیره استفاده می شود.

پس بیایید شروع کنیم:

1. اجازه دهید یک سند جدید ایجاد کنیم (منوی بالای "فایل" - "جدید") با ابعاد، به عنوان مثال، 500 در 500 پیکسل. محتوای پس زمینه: شفاف.

2. به نوار ابزار (واقع در سمت چپ) بروید، ابزار Rectangular Marquee Tool (M) را انتخاب کنید. روی سند خود یک ناحیه مستطیلی می کشیم. گزینه های ابزار خیمه ای مستطیلی: انتخاب جدید، پر: 0 پیکسل، سبک: معمولی (شکل 1).

3. در منوی بالا، برگه "انتخاب" - "تغییر" - "بهینه سازی" را انتخاب کنید (شکل 2). برای مثال، مقدار شعاع را برابر با 20 پیکسل در نظر بگیرید. روی "بله" کلیک کنید. می بینیم که گوشه های مستطیل انتخابی ما با مقدار مقدار انتخاب شده (20 پیکسل) گرد شده است (شکل 3).

4. در منوی بالا، "Edit" - "Stroke" را انتخاب کنید. گزینه های سکته مغزی را تنظیم کنید. عرض: 2 پیکسل (برای شفافیت). بیایید کمی رنگ قرمز بگیریم. در همان برگه، تنظیم کنید: "موقعیت نسبت به مرز: مرکز (شما می توانید مقادیر "داخل" و "خارج" را انتخاب کنید)"، "Overlay: حالت عادی"، "Opacity: 100٪"، "Keep transparency: خالی". روی دکمه "بله" کلیک کنید (شکل 4). انتخاب را حذف کنید - با فشار دادن کلیدهای ترکیبی روی صفحه کلید "Ctrl + D" و قاب مورد نیاز خود را با ضخامت 2 پیکسل، قرمز با لبه های گرد بدست آورید (شکل 5). اکنون می توان از قطعات آن یا کل قاب برای تزئین هر قالب، بنر و غیره استفاده کرد.

برنج. 1	برنج. 2
برنج. 3	برنج. 4
برنج. 5	برنج. 6

برای مثال، و تجسم بهتر، یک لایه جدید پر از رنگ سفید ایجاد کردم، آن را با قاب خود به زیر لایه منتقل کردم و چندین فریم مشابه دیگر با ضخامت، رنگ ها و گوشه های گرد تار ایجاد کردم (شکل 6).

در این بخش از سایت من تصمیم گرفتم قرار دهم درس های فتوشاپ، که ممکن است هنگام ایجاد طراحی وب سایت برای شما مفید باشد. فکر می‌کنم که از طرف خودم، قبل از شروع یادگیری فتوشاپ، این کار را به شما ارائه دهم کلیدهای فوری فتوشاپ. استفاده كردن کلیدهای فوری فتوشاپشما کار خود را آسان تر کرده و در زمان صرفه جویی خواهید کرد. .

اولین من آموزش فتوشاپبه شما خواهد گفت که چگونه گوشه های گردعکس

هنگام ساخت وب‌سایت‌ها، اغلب باید با این مشکل مواجه شوید که چگونه گوشه‌های یک عکس را گرد کنید یا چگونه آن را گرد کنید گوشه های گردعکس در این درس فتوشاپمن به شما یاد خواهم داد که چگونه گوشه های گردکشیدن در فتوشاپ. همچنین این یکی درس فتوشاپبه شما اجازه خواهد داد گوشه های گردعکس ها امیدوارم این برای شما واضح باشد. پس از همه، برای فتوشاپو عکس و عکس همه یکسان است. من در کارم از Adobe استفاده می کنم. فتوشاپ SC5، نسخه روسی. خوب، من در زبان خوب نیستم.

درس امروز درباره گرد کردن گوشه های یک عکس در فتوشاپ است. بیا مثل عکس من با گوشه های گرد عکس بگیریم.

1. انجام دادن گرد کردن گوشه ها در فتوشاپ، بازکردن با فتوشاپتصویری که ما نیاز داریم مثلا یکی از عکس ها را از آرشیو عکسم گرفتم.

2. ابعاد تصویر را به پارامترهایی که نیاز داریم می رسانیم. برای انجام این کار، ALT + CTRL + I را فشار دهید. پنجره Image Size باز می شود. ما ابعاد مورد نیاز خود را تنظیم می کنیم. همچنین می توانید به سادگی تصویر را به اندازه دلخواه برش دهید.

3. تصویر را انتخاب کنید (CTRL+A) (یک خط نقطه چین در اطراف محیط ظاهر می شود) و آن را کپی کنید (CTRL+C). عکس را کپی می کنیم تا تصویر اصلی بدون تغییر باقی بماند، نحوه پیاده سازی را ارسال کنید گرد کردن گوشه ها در فتوشاپ. اگرچه می توان روی نسخه اصلی کار کرد، اما وقتی گوشه های گرد آماده شد، به سادگی عکس را به عنوان تصویر دیگری ذخیره می کنیم.

4. یک پنجره جدید باز کنید (CTRL + N)، ابعاد تصویر مورد نظر را تنظیم کنید و روی "OK" کلیک کنید. لطفا توجه داشته باشید که من پس زمینه را روی "شفاف" تنظیم کردم. شما می توانید بلافاصله پس زمینه رنگ مورد نیاز خود را تنظیم کنید.

5. تصویر کپی شده را در یک پنجره جدید (CTRL+V) قرار دهید و یک لایه جدید (CTRL+SHIFT+N) ایجاد کنید. در این لایه با استفاده از ابزار Rectangle گوشه های گرد"یک مستطیل به اندازه دلخواه بکشید. رنگ مستطیل مهم نیست. ابزار با فشار دادن دکمه سمت راست ماوس انتخاب می شود. یا فقط با فشار دادن کلید (U). شعاع انحنا را به اختیار خود تنظیم کنید (شکل زیر را ببینید).

در صورت لزوم می توانید با استفاده از فلش های روی صفحه کلید یا با موس و در حالی که کلید چپ را پایین نگه داشته اید، شکل ترسیم شده را جابجا کنید. ابتدا فراموش نکنید که "حرکت" را در نوار ابزار (دکمه بالا) فعال کنید. شما همچنین می توانید تغییر اندازهارقام برای انجام این کار، (CTRL + T) را فشار دهید و با نگه داشتن کلید سمت چپ، شکل را به اندازه دلخواه با ماوس بکشید. اگر می خواهید با حفظ تناسبات، اندازه را تغییر دهید، باید SHIFT را نگه دارید و گوشه شکل را بکشید.

6. به پنل لایه ها بروید. در حالی که CTRL را نگه داشته اید، روی پیش نمایش (تصویر) لایه مستطیل کلیک چپ کنید. یک طرح نقطه چین از شکل ظاهر می شود.

7. به لایه پایین بروید. برای این کار در پنل لایه ها بر روی سمت راست تصویر کلیک کنید. در مورد ما، لایه 1. انتخاب آبی به لایه 1 خواهد رفت.

8. CTRL + SHIFT + I را فشار دهید. یک انتخاب نقطه‌دار در امتداد مرز آن قسمت از تصویر که خارج از مستطیل ما است ظاهر می‌شود گوشه های گرد.

9. روی صفحه کلید DEL را فشار دهید. بخشی از تصویر که خارج از مستطیل است حذف می شود.

10. لایه مستطیل را دوباره فعال کنید. با کلیک بر روی نماد سطل زباله آن را حذف کنید.

11. کلید "M" را فشار دهید و روی دکمه سمت چپ ماوس در هر نقطه از تصویر کلیک کنید. انتخاب حذف شده است. آماده. می توانید تصویری را که ما دریافت کرده ایم ذخیره کنید گرد کردن گوشه ها در فتوشاپ، در قالبی که ما نیاز داریم.

اگر از چنین تصویری برای ایجاد طراحی سایت استفاده می شود، آن را برای وب و دستگاه ها (ALT+SHIFT+CTRL+S) ذخیره کنید.

12. توجه! اگر در لبه های تصویر با گوشه های گردپیکسل های شفاف باقی می مانند، شما باید اصلاح کنید. برای انجام این کار، روی "تصویر" کلیک کنید، "Trimming" را انتخاب کنید، در پنجره ای که ظاهر می شود، تنظیمات را مانند تصویر من تنظیم کنید و روی "Ok" کلیک کنید. اندازه بوم به اندازه تصویر تغییر می کند و هر پیکسل شفاف اضافی حذف می شود.

را درس فتوشاپمی توان هم برای عکس های بیضی و هم برای عکس های مجعد استفاده کرد. برای این کار در مرحله 5 به جای ابزار "مستطیل با گوشه های گرد"انتخاب ابزار" بیضی "," چند ضلعی "یا" شکل دلخواه ". سپس همه اقداماتی را که برای بدست آوردن انجام دادیم انجام می دهیم گرد کردن گوشه.

من مدت زیادی است که به دنبال چگونگی گرد کردن گوشه ها با استفاده از Adobe Photoshop بوده ام، اما همه جا نوشتن را در جایی تمام نمی کنند، یا اشتباه نوشته شده است. همانطور که مشخص شد، گرد کردن گوشه های هر تصویر بیش از 30 ثانیه طول نمی کشد، البته پس از اینکه نحوه انجام آن را یاد گرفتید.

و بنابراین، برای انجام چنین عملیات ساده ای باید برنامه را اجرا کنید و تصویر مورد نیاز خود را داخل برنامه بیندازید یا از Menu->File->Open->Desired picture.jpg استفاده کنید.من از تصویر معمولی طبیعت استفاده خواهم کرد.

به گوشه پایین سمت راست توجه کنید، یک تصویر پس زمینه در "لایه ها" ظاهر شده است، باید به یک لایه تبدیل شود. برای انجام این کار، روی پس زمینه کلیک راست کرده و "لایه از پس زمینه" را انتخاب کنید.

در نتیجه این عمل، پس زمینه ما به یک لایه تبدیل می شود.

با کلیک راست بر روی لایه 0 و انتخاب "لایه تکراری" یک تصویر تکراری ایجاد کنید.

شکل 2

"لایه 0" را از فضای کاری پنهان کنید. برای مخفی کردن یک لایه، روی نماد EYES در کنار نام لایه کلیک کنید.

قسمت مورد نظر از تصویر را انتخاب کنید.

به محض اینکه قسمت مورد نظر از تصویر را با یک مستطیل مشخص کردید، در داخل قسمت انتخابی کلیک راست کرده و "Create Selection" را انتخاب کنید.

در کادر محاوره ای، دکمه OK را فشار دهید، پر کردن را لمس نکنید.

یک نکته بسیار مهم! لایه 0 (کپی) را انتخاب کنید، سپس دکمه DELETE را روی صفحه کلید فشار دهید. لایه 0 (کپی) باید با یک کلیک معمولی ماوس انتخاب شود.

اگر همه چیز به درستی انجام شود، در فتوشاپ چیزی شبیه به این تصویر خواهید دید. اکنون می توانید تصویر را به عنوان مثال با فرمت png ذخیره کنید و از کار هنری لذت ببرید.

یک چیز دیگر وجود دارد، اگر قطعه بریده شده دو یا حتی 3 برابر کوچکتر از تصویر اصلی باشد، فضای خالی زیادی خواهد داشت، باید حذف شود. برای انجام این کار، ابزار تودرتو را انتخاب کنید و ناحیه ای از تصویر را بدون ناحیه خالی انتخاب کنید.

سپس به منوی Edit->Copy بروید.

به منوی File->New بروید و فقط روی OK کلیک کنید. این برنامه به طور خودکار عرض و ارتفاع بوم ناحیه انتخاب شده از تصویر را تنظیم می کند.

در پروژه جدید "Untitled 1" و ما به طور خودکار خود را در آن خواهیم یافت، به منوی Edit->Insert بروید.

بهترین راه برای ذخیره یک تصویر استفاده از گزینه "Save for Web" است. اولاً می توانید به صورت دستی کیفیت تصویر را به صورت درصد انتخاب کنید و ثانیاً اندازه تصویر چندین برابر کوچکتر از ذخیره آن به روش معمول خواهد بود.

و در نهایت به چه چیزی رسیدیم.

برای کسانی که نمی دانند چگونه توانستم گوشه ها را دور بزنم، به طور ویژه ویدیویی ضبط کردم که به شما در انجام این کار ساده کمک می کند.

در این آموزش سریع، به شما نشان خواهم داد که چگونه می توانید با استفاده از تکنیک ها و فیلترهای ساده ماسک، گوشه های گرد در فتوشاپ ایجاد کنید.

می توانید شعاع گوشه را طوری تنظیم کنید که لبه شکل، متن و غیره را گرد کند. این یک روش سریع و آسان برای ایجاد گوشه های گرد است. برای ایجاد آنها می توانید از یک لایه ماسک استفاده کنید.

با استفاده از یک سری مراحل ساده در فتوشاپ، قادر خواهید بود یک مستطیل با گوشه های گرد بسازید. فتوشاپ فیلتر یا ابزاری برای ایجاد یک گوشه گرد ندارد، اما شما می توانید این کار را با Illustrator انجام دهید. این به شما این امکان را می دهد که تقریباً روی هر شیء یک افکت گوشه گرد ایجاد کنید. در آن شما باید به منو بروید جلوه ها > استایلینگ > گوشه های گرد(افکت‌ها > سبک‌سازی > گوشه‌های گرد).

مرحله 1

در این آموزش سریع، یک روش ساده برای بدست آوردن گوشه های گرد در فتوشاپ با استفاده از متن شطرنجی، یک شکل یا یک تصویر به شما نشان می دهم. بیایید یک تصویر برداری از یک ستاره با گوشه های تیز بگیریم (این روش با زوایای قائم نیز به خوبی کار می کند).

گام 2

حالا باید لایه را شطرنجی کنید. برای انجام این کار، روی تصویر کوچک لایه ستاره در پالت لایه ها کلیک راست کرده و انتخاب کنید. لایه شطرنجی کنید(Rasterize Layer). اگر از لایه متنی استفاده می کنید باید همین کار را انجام دهید.

مرحله 3

به منو بروید Filter > Blur(Filter > Blur) و انتخاب کنید تاری گاوسی(تاری گاوسی). شعاع تاری به اندازه تصویر و نتیجه ای که می خواهید به دست آورید بستگی دارد. من شعاع 5 پیکسل را انتخاب می کنم.

مرحله 4

کلید Ctrl را نگه دارید و روی تصویر بندانگشتی لایه کلیک کنید تا انتخاب تصویر فعال شود. بعد، به منو بروید انتخابو انتخاب کنید لبه را اصلاح کنید(> Refine Edge را انتخاب کنید). می توانید با گزینه ها آزمایش کنید صاف کردن(صاف) و پر(پر) برای انتخاب افکت مورد نظر. تضاد(کنتراست) آن را 100 کنید.

مرحله 5

رنگ شکل را بگیرید، در مورد ما زرد است و کل انتخاب را با این رنگ پر کنید. می توانید این کار را با فشار دادن کلیدهای ترکیبی "Shift + F5" انجام دهید.

مرحله 6

بدون حذف انتخاب، باید با کلیک بر روی نماد واقع در پایین پالت لایه ها، یک لایه ماسک اضافه کنید. تمام است، حالا ستاره گوشه های گرد دارد.

همانطور که در تصویر زیر نشان داده شده است می توانید از همین روش برای ایجاد متن با گوشه های گرد استفاده کنید. حالا می توانید فونت خود را بسازید.