மொபைல் சாதனங்களுக்கான படங்களை தயார் செய்தல்

மொபைலுக்கான இமேஜிங் எப்பொழுதும் தோன்றுகிறது

கிராபிக்ஸ் செயல்திறன் அச்சிடப்பட்டதோடு மட்டுமல்லாமல் ஐபோன்கள், ஐபாட்கள், அண்ட்ராய்டு சாதனங்கள் மற்றும் அண்ட்ராய்டு டேப்லெட்டுகள் போன்ற வலை மற்றும் சாதனங்களிலும் கிராபிக்ஸிற்கு மிகவும் பொதுவானதாகி வருகிறது. மேற்பரப்பில், இது டிஜிட்டல் திரைகளில் விரிவுபடுத்தப்படுகிற ஊடகம் ஊடாக ஒரு "நல்ல விஷயம்" என்று காணலாம். குறைவான திரைகள் மற்றும் திரையில் தீர்மானங்களை குழப்பமான எண் ஆகும். CMYK வடிவமைப்பில் 300 dpi Resolution டிஐஎஃப்எஃப் உருவமாக இருக்கும் நாட்களுக்கு நடந்தது என்னவென்று யோசித்துப் பார்ப்பது அசாதாரணமானது அல்ல. ஓ பழைய பழைய நாட்களுக்கு!

அந்த நாட்கள் முடிந்து விட்டன. ஒரு 200 க்கும் 200 க்கும் மேற்பட்ட படம் ஒரு சாதனத்தில் நன்றாகத் தோன்றக்கூடும் என்பதோடு இன்னும் ஒரு காலாண்டில் மற்றொரு காலாண்டில் மூன்று காலாண்டு அளவைக் காட்டியுள்ளோம் என்பதில் நாம் இப்போது உறுதியாக இருக்க வேண்டும். சாதனம் உற்பத்தியாளர்களால் முன்னெடுக்கப்படும் "தீர்மானம் ஆயுத ரேஸ்" க்கு இது உண்மையில் பொருந்துகிறது, ஏனெனில் அவர்களது போட்டியாளர்களைக் காட்டிலும் அதிகமான பிக்சல்கள் ஒரு திரையில் பிடிக்கின்றன.

இது நாம் "சஃபிஸஸ் எழுச்சி" என்று அழைக்கிறோம். பின்னொட்டுகள் அந்த விஷயங்கள் - @ 2x, @ 3x - ஒரு படத்தின் பெயருக்கு பொருத்தப்பட்டன. உதாரணமாக, சரியான சாதனத்தில் சரியான படத்தில் சரியான படத்தை வைக்கவும். அது இன்னும் சிறப்பாக அமையும்.

எங்கள் வேலை நிறைய சின்னங்கள் வேலை மற்றும், பிளாட் வடிவமைப்பு இயக்கம் எழுச்சி, இந்த விஷயங்களை Illustrator மற்றும் ஸ்கெட்ச் போன்ற திசையன் வரைதல் பயன்பாடுகள் உருவாக்கப்பட்ட. பிரச்சனை சாதனங்கள் எளிமையாக வழங்க முடியாது. அவர்கள் அளவிடக்கூடிய வெக்டர் கிராபிக்ஸ் மாற்ற வேண்டும், மற்றும் சின்னங்கள் உருவாக்க பயன்படும் பொறுத்து, ஒரு SVG விருப்பம் கூட இருக்கலாம்.

அது இன்னும் சிறப்பாக அமையும்.

மென்பொருள் ஒரு புதிய வர்க்கம் உள்ளது- Prototyping பயன்பாடுகள் - உங்கள் படங்கள் மற்றும் சின்னங்கள் சாதனங்கள் வெளியே shoved முன் அவர்கள் சட்டசபை புள்ளி மாறி வருகின்றன மற்றும் அவர்கள் தங்கள் தனித்தன்மையும் வேண்டும்.

இந்த பயிற்சி கிராபிக்ஸ் ஃபோட்டோஷாப் மற்றும் ஸ்கெட்ச் இடையே நகரும் மற்றும் அடோப் எக்ஸ்பீரியன்ஸ் டிசைன் பயன்படுத்தி உங்கள் யோசனை மற்றும் இறுதியில் வரிசைப்படுத்தல் இடையே வலி புள்ளிகள் ஒரு சில நிரூபிக்க. தொடங்குவோம்.

05 ல் 05

Adobe Photoshop இல் மொபைல் சாதனங்களுக்கான படங்களை எப்படி தயாரிப்பது

இந்த செயல்பாட்டில் முதல் படி உங்கள் இலக்கு சாதனத்தை அல்லது சாதனங்களை தெரிந்துகொள்கிறது. இந்த நிலையில், நீங்கள் 667 பிக்சல்கள் அதிகபட்சமாக 375 பிக்சல்கள் அகலத்தின் திரை பகுதி கொண்ட ஐபோன் 6 ஐ இலக்காகக் கொண்டிருப்பீர்கள். வடிவமைப்பு திரையின் அகலமாக இருக்க வேண்டுமென்று வடிவமைப்பு அழைக்கிறது.

பயன்படுத்தப்பட வேண்டிய படம் சுவிட்சர்லாந்தின் பெர்ன் மினெஸ்டர் கதீட்ரல் உள்ளே சுடப்பட்டது. ஃபோட்டோஷாப் படத்தைத் திறக்கும்போது, படத்தின்> பட அளவைத் தேர்ந்தெடுங்கள் படத்தின் பரிமாணங்களையும் அதன் தெளிவுத்திறனையும் சோதிக்க. வெளிப்படையாக, 300ppi ஒரு தீர்மானம் கொண்ட 3156 x 2592 ஒரு படம் மற்றும் 23.4 எம்பி ஒரு கோப்பு அளவு வெறுமனே வேலை செய்யாது.

பட அளவு டயலாக் பெட்டியில் உள்ளே, தீர்மானத்தை 100 ppi க்கு குறைக்கலாம் . பட பரிமாணங்களும் மாறும் என்பதால் இதை முதலில் செய்யுங்கள். தீர்மானம் அமைக்க, அகலம் மாற்ற 375 பிக்சல்கள். பட அளவைத் தரவை நீங்கள் சரிபார்த்தால், படத்தை 23.4 Mb இலிருந்து குறைத்து மொபைல்-நட்பு 338k வரை குறைக்கப்பட்டுள்ளது. மாற்றத்தை ஏற்றுக் கொள்ள சரி என்பதை கிளிக் செய்யவும் மற்றும் பட அளவு உரையாடல் பெட்டியை மூடவும்.

02 இன் 05

அடோப் ஃபோட்டோஷாப் உள்ள "ஏற்றுமதி என ..." உரையாடல் பெட்டி எவ்வாறு பயன்படுத்துவது

ஏற்றுமதி செய்ய தயாராக உள்ளது எனில், "ஏற்றுமதி> ஏற்றுமதி செய்யுங்கள் ..." ஏற்றுமதி உரையாடல் பெட்டியாக திறக்க.

இந்த டயலாக் பாக்ஸ் ஃபோட்டோஷாப் ஒரு சமீபத்திய கூடுதலாக உள்ளது மற்றும் அவர்கள் பல ஆண்டுகளாக பயன்படுத்தப்படும் "சேமித்து வலை" உரையாடல் பெட்டி பதிலாக. நீங்கள் இன்னும் தேவைப்பட்டால், அதை ஏற்றுமதி பாப் கீழே காணலாம். வெளிப்படையான காரணங்களுக்காக, இப்போது "இணைய (மரபுவழி) ஏற்றுமதி" என்று அறியப்படுகிறது. இந்த உரையாடல் பெட்டிக்கு உங்கள் முதல் வருகை என்றால், இங்கே ஒரு சுருக்கமான பயணம்:

• அளவு: இந்த பத்தியில் படத்தின் வெளியீடு அளவு அமைக்கிறது. இந்த பகுதியில் உள்ள சுவாரஸ்யமான அம்சம் இது படத்தைப் பெரிதாக்குகிறது ஆனால் சாதனத்தின் திரையில் பிக்சல்கள் அதிக எண்ணிக்கையில் இருப்பதால் படத்தில் "தெளிவில்லாமல்" தோன்றாது.
• 1X: இதைக் கிளிக் செய்து, பல அளவுகளைக் கொண்டிருக்கும். 1x, 2x மற்றும் 3x பிரிவுகள் பாரம்பரியமாக ஆப்பிள் இலிருந்து Hi Dpi சாதனங்களுடன் தொடர்புடையவையாகும், மேலும் சில மற்றவர்களுடன் சேர்ந்து Android சாதனங்களுக்கான படங்களை தயார் செய்யும்.
• பின்னணி: இந்த தேர்வு உங்கள் அளவு காண்பிக்கும் ஆனால் அது @ 2x அல்லது அளவு தேர்வு செய்யப்பட்டுள்ளது. இந்த பின்னொட்டு படத்தை பெயருக்கு சேர்க்கப்படும்.
• + அடையாளம்: வெளியீடுக்காக பல்வேறு அளவுகள் சேர்க்க இதை சொடுக்கவும். இந்த நிலையில், அதை இரண்டு முறை கிளிக் செய்து, பாப் கீழே இருந்து 2x மற்றும் 3x ஐத் தேர்வு செய்யவும். எந்த iOS சாதனம் நடைமுறையில் இது மூடிவிடும்.
• குப்பைத் தொட்டி: இதை சொடுக்கி, வரிசையில் இருந்து தேர்வு நீக்கப்பட்டது.
• கோப்பு அமைப்புகள்: jpg, png, gif அல்லது svg - படத்திற்கு சிறந்த பொருத்தமாக - வடிவம் தேர்வு செய்யவும். கோப்பின் அளவு ஒரு கவலையாக இருந்தால், நீங்கள் தர அமைப்புகளை குறைக்கலாம்.
• பட அளவு: நீங்கள் படத்தை உடல் பரிமாணங்களை மாற்ற முடியும்.
• கேன்வாஸ் அளவு: நீங்கள் படத்தை கேன்வாஸ் உடல் பரிமாணங்களை மாற்ற முடியும்.
• மெட்டாடேட்டா: பதிப்புரிமை மற்றும் உங்கள் தொடர்புத் தகவல்களை படத்தை மெட்டாடேட்டாவில் சேர்க்கலாம்.

முடிந்ததும் ஏற்றுமதி பொத்தானைக் கிளிக் செய்யவும். படங்களை எங்கு வைக்க விரும்புகிறீர்கள் என்று நீங்கள் கேட்கப்படுவீர்கள். புதிய ஃபோட்டோடர் பொத்தானை கிளிக் செய்து, ஏற்றுமதி செய்யப்பட்ட படங்களை வைத்திருப்பதற்கு ஒரு கோப்புறையை உருவாக்க வேண்டும். ஏற்றுமதிக்கு கிளிக் செய்தால், நீங்கள் கோப்புறையில் உள்ள படங்களைக் காண்பிக்கலாம்.

03 ல் 05

ஸ்கேட்ச் 3 மொபைல் சாதனங்களுக்கான படங்களை தயாரிப்பது எப்படி போஹேமியன் குறியீட்டு இலிருந்து

வலை மற்றும் பயன்பாட்டு வடிவமைப்பில் அதன் தீவிரமான கவனம் காரணமாக UX மற்றும் UI வடிவமைப்பாளர்களிடையே விரைவானது போஹேமியன் கோடங்கின் ஒரு மேகிண்டோஷ்-மட்டுமே பயன்பாட்டு ஸ்கெட்ச் 3 ஆகும். உண்மையில் ஃபோட்டோஷாப், பல வழிகளில், ஸ்கெட்ச் மூலம் "பிடிக்க" விளையாட வேண்டிய ஒற்றைப்படை நிலையில் உள்ளது.

ஸ்கெட்ச்சில் மொபைலுக்கான ஒரு படத்தை தயாரிப்பதற்கு, படத்தில் உள்ள படத்தைத் தேர்ந்தெடுத்து , பண்புகள் பேனலின் கீழே உள்ள ஏற்றுமதி ஏற்றுமதி பொத்தானைக் கிளிக் செய்யவும் . இது ஏற்றுமதி உரையாடல் பெட்டியைத் திறக்கும். 2x மற்றும் 3x பதிப்பைச் சேர்ப்பதற்கு + குறியைக் கிளிக் செய்து, suffixes ஐயும் சேர்க்கவும். கிடைக்கக்கூடிய வடிவங்கள் PNG, JPG, TIF, PDF, EPS மற்றும் SVG. இந்த விஷயத்தில், JPG ஐத் தேர்ந்தெடுக்கவும். ஏற்று ஏற்றுமதி பொத்தானை கிளிக் செய்யவும் அல்லது ஏற்றுமதி செய்ய பல்வேறு படங்களை நடத்த ஒரு கோப்புறையை உருவாக்க.

04 இல் 05

படத்தின் மூன்று (அல்லது அதற்கு மேற்பட்ட) பதிப்பை நீங்கள் ஏன் உருவாக்க வேண்டும்

பல விதங்களில், மொபைல் சந்தை தீர்மானங்களை "காட்டு மேற்கு" மற்றும் ஒரு அளவு நிச்சயமாக அனைத்து பொருந்தும் இல்லை. அடோப் எக்ஸ்பீரியன்ஸ் டிசைன் என்பதிலிருந்து மேலே குறிப்பிடப்பட்ட எடுத்துக்காட்டில், படம் 2 ஐபோன் 6 கலைக்கூடங்கள் மற்றும் ஒரு Android சாதன கலைக்கூடத்தில் வைக்கப்பட்டது. இடதுபுறத்தில் 1x பதிப்பு எப்படி பாதி அளவுக்கு தோன்றுகிறது என்பதை கவனிக்கவும். இது விழித்திரை திரையில் ஐபோன் 6 இல் தோன்றும் படம் இதுதான். 2x பதிப்பு செய்தபின் பொருந்துகிறது மற்றும் Android பதிப்பு திரை ஆஃப் இயங்கும். படத்தின் அளவை அளவிட அல்லது ஃபோட்டோஷாப் படத்திலிருந்து வேறு அளவுக்கு ஏற்றுமதி செய்ய வேண்டும்.

05 05

டெஸ்ட் ஆரம்பத்தில், டெஸ்ட் பெரும்பாலும், நம்பிக்கை எதுவும், நம்பிக்கை இல்லை குறிப்பாக உங்களை நம்புங்கள்

நீங்கள் புரிந்து கொள்ள வேண்டியது இது செயல்முறையின் தொடக்கமாகும். உங்களுடைய பணியை பல சாதனங்களில் பார்க்கும் பொழுது, உங்களுடைய வேலைப்பாட்டின் முக்கிய பகுதியாக கருதப்பட வேண்டும். பயன்பாட்டிற்கான அல்லது மொபைல் வலை திட்டங்களுக்கு கிராபிக்ஸ் சொத்துக்களை உருவாக்கும் செயல்முறையில் இது முதல் படி என்பதை நீங்கள் அறிந்து கொள்ள வேண்டும்.

புரோட்டோடைப்பிங் பயன்பாடுகளைப் பயன்படுத்துவதால் வலி புள்ளிகளைக் கண்டறிவதற்கான ஒரு சிறந்த வழியாகும், ஆனால் அதே சொத்துக்கள் டெவெலப்பரின் பயன்பாட்டிற்கு வெளியீடாக இருக்க வேண்டும். பல சந்தர்ப்பங்களில், சின்னங்கள் உட்பட சொத்துகளின் உடல் பரிமாணங்கள், svg, png வடிவத்தில் இல்லை. முதல் பார்வையில், இது மேல் ஒரு பிட் போல் தோன்றலாம் ஆனால் அளவிடுதல் படங்களை தங்க விதி நினைவில் கொள்ளுங்கள்: அளவை விட கீழே அளவிட நல்லது.

கீழே வரி உங்கள் டெவலப்பர் நெருக்கமாக வேலை மற்றும் உங்கள் வடிவமைப்பு நோக்கம் காட்டும் ஒரு வழியாக முன்மாதிரி மென்பொருள் பயன்படுத்த உள்ளது. இறுதியில், எனினும், அதே சொத்துக்கள் இறுதி தயாரிப்பு தயாராக இருக்க வேண்டும் மற்றும் உங்கள் டெவெலபர் அவர் அல்லது நீங்கள் விட வேண்டும் என்ன ஒரு நல்ல கைப்பிடி உள்ளது.