మొబైల్ పరికరాల కోసం చిత్రాలను సిద్ధం చేస్తోంది

మొబైల్ కోసం ఇమేజింగ్ ఎల్లప్పుడూ కనిపించేది కాదు

గ్రాఫిక్స్ ప్రోస్ ముద్రణలో కనిపిస్తాయి కాని ఐఫోన్ మరియు ఐప్యాడ్ ల, ఐప్యాడ్ ల, Android పరికరాలు మరియు ఆండ్రాయిడ్ టాబ్లెట్ల వంటి పరికరాల్లో మాత్రమే కనిపిస్తాయి. ఉపరితలంపై, మా పని డిజిటల్ తెరలకు విస్తరించింది మాధ్యమంగా ఇది ఒక "మంచి విషయం" గా చూడబడుతుంది. ఇబ్బంది పెద్ద సంఖ్యలో తెరలు మరియు తెర తీర్మానాల గందరగోళ సంఖ్య. CMYK ఫార్మాట్ లో 300 dpi రిజల్యూషన్ TIFF ఇమేజ్ కట్టుబాటు అయిన రోజులకు సంభవించినది ఏమైనా సంకోచించకపోవచ్చు. మంచి పాత రోజులు ఓహ్!

ఆ రోజుల్లో ఉన్నాయి. ఒక 200 నుండి 200 ఇమేజ్ ఒక పరికరంలో జరిగే అవకాశం ఉందని మరియు ఇంకా మరో క్వార్టర్ పరిమాణంలో మరో త్రైమాసిక పరిమాణంలో మరొకదానిపై మరొకటి కనిపిస్తుంది. వారు నిజంగా వారి పోటీదారుల కంటే స్క్రీన్లో ఎక్కువ పిక్సెల్లు ప్రయత్నించండి, పరికర తయారీదారులు చేత "రిజల్యూషన్ ఆర్మ్స్ రేస్" కు డౌన్ వస్తుంది.

ఇది మేము "సఫీక్స్ ది రైజ్ ఆఫ్" అని పిలిచే దాన్ని మాకు తెస్తుంది. అంత్యపదాలు ఆ విషయాలు - @ 2x, @ 3x - ఒక చిత్రం యొక్క పేరు మీద tacked. అవి తప్పనిసరిగా, ఉదాహరణకు, సరైన పరికరంలో కుడి స్థానంలో కుడి స్థానంలో ఉంచండి. అప్పుడు అది మరింత మెరుగవుతుంది.

మా పని చాలా చిహ్నాలు పని మరియు ఉంటుంది, ఫ్లాట్ డిజైన్ ఉద్యమం యొక్క పెరుగుదల, ఈ విషయాలు చిత్రకారుడు మరియు స్కెచ్ వంటి వెక్టర్ డ్రాయింగ్ అనువర్తనాల్లో సృష్టించబడతాయి. సమస్య కేవలం పరికరాలు. వారు స్కేలబుల్ వెక్టార్ గ్రాఫిక్స్గా మార్చబడాలి మరియు చిహ్నాలను రూపొందించడానికి ఉపయోగించే అనువర్తనం ఆధారంగా, ఒక SVG ఎంపిక కూడా ఉండకపోవచ్చు.

అప్పుడు అది మరింత మెరుగవుతుంది.

ఒక కొత్త తరగతి సాఫ్ట్వేర్ ఉంది- ప్రోటోటైపింగ్ అప్లికేషన్లు - మీ చిత్రాలను మరియు చిహ్నాలు ముందు పరికరాలకు shoved మరియు వాటిని వారి విశేషములు కలిగి ముందు అసెంబ్లీ పాయింట్ మారింది.

ఈ ట్యుటోరియల్ గ్రాఫిక్స్ కోసం Photoshop మరియు Sketch మధ్య కదులుతుంది మరియు మీ ఆలోచన మరియు చివరకు విస్తరణ మధ్య కొన్ని నొప్పి పాయింట్లను ప్రదర్శించేందుకు Adobe Experience Design ను ఉపయోగించుకుంటుంది. ప్రారంభించండి.

01 నుండి 05

Adobe Photoshop లో మొబైల్ పరికరాల కోసం చిత్రాలను ఎలా సిద్ధం చేయాలి

ఈ ప్రాసెస్లో మొదటి దశ మీ లక్ష్య పరికరం లేదా పరికరాలను తెలుసుకోవడం. ఈ సందర్భంలో, మీరు 667 పిక్సెల్స్ గరిష్టంగా 375 పిక్సల్స్ వైడ్ స్క్రీన్ వైశాల్యాన్ని కలిగి ఉన్న ఐఫోన్ 6 ను లక్ష్యంగా చేస్తాము. ఈ చిత్రం స్క్రీన్ వెడల్పుగా పిలవబడుతుంది.

బెర్న్లోని బెర్న్ మిన్స్టర్ కేథడ్రల్ లోపల స్విట్జర్లాండ్ ఉపయోగించబడింది. చిత్రం Photoshop లో తెరిచిన తర్వాత, ఇమేజ్ > ఇమేజ్ పరిమాణాన్ని ఎంచుకోండి చిత్రం యొక్క కొలతలు మరియు దాని యొక్క స్పష్టీకరణను తనిఖీ చేయండి. సహజంగానే, 3156 x 2592 చిత్రం 300 ppi యొక్క రిజల్యూషన్ మరియు 23.4 Mb ఫైల్ పరిమాణాన్ని కలిగి ఉండదు.

చిత్రం సైజు డైలాగ్ బాక్స్ లోపలికి, రిజల్యూషన్ను 100 ppi కు తగ్గించండి . ఇమేజ్ కొలతలు కూడా మారిపోతాయి కాబట్టి ఇది మొదట చేయండి. రిజల్యూషన్ సెట్ తో, వెడల్పు మార్చడానికి 375 పిక్సెల్స్. మీరు ఇమేజ్ సైజు డేటాను తనిఖీ చేస్తే, చిత్రం 23.4 Mb నుండి మరింత మొబైల్-స్నేహపూర్వక 338k కు తగ్గిపోయింది. మార్పును ఆమోదించడానికి సరే క్లిక్ చేసి, బొమ్మ సైజు డైలాగ్ బాక్స్ మూసివేయండి.

02 యొక్క 05

ఎలా Adobe Photoshop లో డైలాగ్ బాక్స్ "ఎగుమతి ..." ఉపయోగించండి

చిత్రం ఎగుమతికి సిద్ధంగా ఉంటే, డైలాగ్ బాక్స్ వలె ఎగుమతిని తెరవడానికి "ఎగుమతి> ఎగుమతి చేయి ..." ఎంచుకోండి .

ఈ సంభాషణ పెట్టె ఇటీవల Photoshop కు అదనంగా ఉంది మరియు వారు సంవత్సరాల్లో ఉపయోగించిన "సేవ్ ఫర్ వెబ్" సంభాషణ పెట్టెని భర్తీ చేస్తారు. మీకు ఇప్పటికీ అవసరమైతే, ఎగుమతి పాప్ డౌన్ లో దాన్ని కనుగొనవచ్చు. ఇది స్పష్టమైన కారణాల కోసం, ఇప్పుడు "ఎగుమతి కోసం వెబ్ (లెగసీ)" అని పిలుస్తారు. ఈ డైలాగ్ పెట్టెలో మీ మొదటి సందర్శన అయితే, ఇక్కడ క్లుప్త పర్యటన ఉంది:

• పరిమాణం: ఈ కాలమ్ చిత్రం యొక్క అవుట్పుట్ పరిమాణాన్ని సెట్ చేస్తుంది. ఈ ప్రాంతం యొక్క ఆసక్తికరమైన అంశం ఇది చిత్రాన్ని విస్తరింపజేస్తుంది, అయితే పరికరం యొక్క స్క్రీన్లో పిక్సెల్స్ యొక్క భారీ సంఖ్యలో ఉన్న కారణంగా ఈ పరికరం పరికరంలో "మసకగా" కనిపించదు.
• 1X: దీనిని నొక్కి పట్టుకోండి మరియు మీకు అనేక పరిమాణాలు ఉంటాయి. 1x, 2x మరియు 3x కేతగిరీలు సంప్రదాయబద్ధంగా ఆపిల్ నుండి హాయ్ డిపి పరికరాలతో అనుబంధం కలిగి ఉన్నాయి మరియు అవి మరికొంతమంది ఇతరులతో పాటు Android పరికరాల కోసం చిత్రాలను సిద్ధం చేస్తాయి.
• ప్రత్యయం: ఈ ఎంపిక మీ పరిమాణం చూపుతుంది కానీ అది @ 2x లేదా పరిమాణం ఎంపిక చేయబడుతుంది. ఈ అంశపు చిత్రం పేరుకు చేర్చబడుతుంది.
• + సైన్: అవుట్పుట్ కోసం వివిధ పరిమాణాలను జోడించడానికి ఈ క్లిక్ చేయండి. ఈ సందర్భంలో, అది రెండుసార్లు క్లిక్ చేసి, పాప్ నుండి 2x మరియు 3x ను ఎంచుకుంటుంది. ఇది ఏ iOS పరికరం ఆచరణాత్మకంగా కవర్ చేస్తుంది.
• ట్రాష్ కెన్: దీన్ని క్లిక్ చేయండి మరియు లైనప్ నుండి ఎంపిక తొలగించబడుతుంది.
• ఫైల్ సెట్టింగులు: jpg, png, gif లేదా svg - ఇమేజ్కు సరిగా సరిపోయే ఆకృతిని ఎంచుకోండి. ఫైలు పరిమాణం ఒక ఆందోళన ఉంటే మీరు కూడా నాణ్యత సెట్టింగులను తగ్గించవచ్చు.
• చిత్రం పరిమాణం: మీరు చిత్రం యొక్క భౌతిక కొలతలు మార్చవచ్చు.
• కాన్వాస్ సైజు: మీరు చిత్ర కాన్వాస్ యొక్క భౌతిక కొలతలు మార్చవచ్చు.
• మెటాడేటా: మీరు చిత్రం యొక్క మెటాడేటాకు కాపీరైట్ మరియు మీ సంప్రదింపు సమాచారాన్ని జోడించవచ్చు.

పూర్తి చేసిన తర్వాత, ఎగుమతి అన్ని బటన్ను క్లిక్ చేయండి. మీరు చిత్రాలను ఎక్కడ ఉంచాలనుకుంటున్నారో మీరు అడగబడతారు. కొత్త ఫోల్డర్ బటన్ పై క్లిక్ చేసి, ఎగుమతి చేయబడిన చిత్రాలను పట్టుకోవటానికి ఫోల్డర్ను సృష్టించడమే మంచి అలవాటు. మీరు ఎగుమతి క్లిక్ చేసినప్పుడు, మీరు ఫోల్డర్ లో చిత్రాలను చూపించబడతారు.

03 లో 05

బహేమియన్ కోడింగ్ నుండి స్కెచ్ 3 లో మొబైల్ పరికరాల కోసం చిత్రాలను ఎలా సిద్ధం చేయాలి

బోహేమియన్ కోడింగ్ నుండి మేకింతోష్-మాత్రమే అప్లికేషన్ స్కెచ్ 3, వెబ్ మరియు అనువర్తన రూపకల్పనలో దాని యొక్క తీవ్రమైన దృష్టి కారణంగా UX మరియు UI డిజైనర్ల మధ్య ప్రాముఖ్యతను సంతరించుకుంది. వాస్తవానికి Photoshop, అనేక విధాలుగా, స్కెచ్ తో "క్యాచ్" ఆడటానికి బేసి స్థితిలో ఉంది.

స్కెచ్లో మొబైల్ కోసం ఒక చిత్రాన్ని రూపొందించడానికి, చిత్రపటాన్ని చిత్రంలో ఎంచుకోండి మరియు లక్షణాల ప్యానెల్లో దిగువ ఉన్న ఎగుమతి చేయి బటన్ను క్లిక్ చేయండి . ఇది ఎగుమతి డైలాగ్ బాక్స్ తెరవబడుతుంది. 2x మరియు 3x సంస్కరణలను జోడించడానికి మరియు ప్రత్యయంలను జోడించేందుకు + సైన్ను క్లిక్ చేయండి. అందుబాటులో ఉన్న ఫార్మాట్లు PNG, JPG, TIF, PDF, EPS, మరియు SVG. ఈ సందర్భంలో, JPG ను ఎంచుకోండి. ఎగుమతి బటన్ మరియు లక్ష్యం క్లిక్ చేయండి లేదా ఎగుమతి చేయబడిన వివిధ చిత్రాలను పట్టుకోడానికి ఫోల్డర్ను సృష్టించండి.

04 లో 05

ఎందుకు మీరు చిత్రం యొక్క మూడు (లేదా మరిన్ని) సంస్కరణలను సృష్టించాలి

అనేక విధాలుగా, మొబైల్ మార్కెట్ తీర్మానాలు "వైల్డ్ వెస్ట్" మరియు ఒక పరిమాణం ఖచ్చితంగా అన్ని సరిపోయే లేదు. Adobe Experience Design నుండి పై ఉదాహరణలో, చిత్రం 2 ఐఫోన్ 6 ఆర్ట్ బోర్డులు మరియు ఒక Android పరికరం ఆర్ట్ బోర్డు మీద ఉంచబడింది. ఎడమవైపు ఉన్న 1x సంస్కరణ సగం పరిమాణం ఎలా ఉన్నట్లు గమనించండి. ఈ చిత్రం రెటీనా స్క్రీన్తో ఐఫోన్ 6 లో ఎలా కనిపిస్తుందో ఖచ్చితంగా చెప్పవచ్చు. 2x సంస్కరణ సంపూర్ణంగా సరిపోతుంది మరియు ఆండ్రాయిడ్ సంస్కరణ తెరవెనుక నడుస్తుంది. మీ ఎంపిక ఫోటోను వేరే పరిమాణంలో చిత్రీకరించడానికి లేదా ఫోటోషాప్ నుండి చిత్రాన్ని ఎగుమతి చేసుకోవడం.

05 05

పరీక్ష ప్రారంభ, టెస్ట్ తరచుగా, ట్రస్ట్ నథింగ్, ట్రస్ట్ ఎవరూ మరియు ప్రత్యేకంగా మీరే

మీరు అర్థం చేసుకోవలసిన అవసరం ఏమిటంటే ఈ ప్రక్రియ ప్రారంభం మాత్రమే. మీరు మీ పనిని అనేక పరికరాల్లో చూస్తారు, ఇది మీరు వర్క్ఫ్లో కీలక భాగం గా పరిగణించబడాలి. మీరు అనువర్తనం లేదా మొబైల్ వెబ్ ప్రాజెక్ట్ల కోసం గ్రాఫిక్స్ ఆస్తులను సృష్టించే ప్రక్రియలో ఇది మొదటి అడుగు మాత్రమే.

నమూనా అనువర్తనాలను ఉపయోగించి నొప్పి పాయింట్లను బహిర్గతం చేయడానికి ఒక గొప్ప మార్గం కానీ ఈ అదే ఆస్తులు డెవలపర్ ద్వారా ఉపయోగం కోసం అవుట్పుట్ ఉండాలి. అనేక సందర్భాల్లో, చిహ్నాలు సహా ఆస్తుల భౌతిక కొలతలు భౌతికంగా భారీ మరియు svg కానీ png ఫార్మాట్ లో ఉంటుంది. మొదటి చూపులో, ఇది పైభాగంలో కొంచెం ఉన్నట్లుగా కనిపిస్తోంది, కాని స్కేలింగ్ చిత్రాల గోల్డెన్ రూల్ గుర్తుంచుకోవాలి: స్కేల్ కంటే స్కేల్ చేయడం మంచిది.

బాటమ్ లైన్ మీ డెవలపర్తో కలిసి పనిచేయడం మరియు నమూనా రూపకల్పనను చూపించే మార్గంగా నమూనా సాఫ్ట్వేర్ను ఉపయోగించడం. చివరికి, అయితే, అదే ఆస్తులు తుది ఉత్పత్తి కోసం సిద్ధంగా ఉండాలి మరియు మీ డెవలపర్ అతను లేదా ఆమె కంటే మీరు అవసరం ఏమి ఒక మంచి హ్యాండిల్ ఉంది.