Κατεβάστε το πρόγραμμα σκίτσο. Γιατί οι ειδικοί της διεπαφής χρήστη εγκαταλείπουν το Photoshop και μεταβαίνουν στο Sketch. Μετάβαση στο Σκίτσο

ΣΕ ΠρόσφαταΤο ζήτημα των εργαλείων για ειδικούς UI/UX είναι πολύ πιεστικό: ποιο λογισμικό πρέπει να χρησιμοποιήσω για την ανάπτυξη διεπαφών; Και εμείς στην εταιρεία μας συζητάμε θερμά αυτό το θέμα. Και οι συζητήσεις είναι συχνά πολύ έντονες. Τι να επιλέξετε για δουλειά; Ποιος επεξεργαστής είναι πιο λειτουργικός για την εργασία ενός συγκεκριμένου σχεδιαστή; Η λίστα των εργασιών μας είναι αρκετά μεγάλη, ξεκινώντας από τη δημιουργία εταιρική ταυτότητακαι τελειώνει με τον πλήρη κύκλο ανάπτυξης σύνθετων ψηφιακών προϊόντων. Για παράδειγμα, εφαρμογές για κινητάγια τη διαχείριση συστημάτων έξυπνο σπίτι, πλήρως εξοπλισμένα συστήματα ηλεκτρονικού εμπορίου.
Δεν θα είμαι ο πρώτος που θα θέσω αυτά τα ερωτήματα, αλλά θα προσπαθήσω να δώσω συνοπτικές απαντήσεις σε αυτά. Ίσως το άρθρο μου να ενδιαφέρει αρχάριους σχεδιαστές που δεν έχουν ακόμη αποφασίσει οριστικά την κατεύθυνση της δραστηριότητάς τους ή σχεδιαστές που θέλουν να επανεκπαιδευτούν από τη μια ειδικότητα στην άλλη.


Τα τελευταία είκοσι χρόνια, το Adobe Photoshop παραμένει το πιο δημοφιλές πρόγραμμα επεξεργασίας γραφικών για τους σχεδιαστές. Ωστόσο, πρόσφατα το πρωτάθλημα της εταιρείας Πλίθαστην αγορά εργαλείων για ψηφιακούς σχεδιαστές κλονίστηκε, το 2012 η εταιρεία Bohemian Codingκυκλοφόρησε Σκίτσο. Σκίτσοείναι ένα επαγγελματικό πρόγραμμα επεξεργασίας διανυσματικών γραφικών σχεδιασμένο ειδικά για δημιουργία γραφικές διεπαφές: web, εφαρμογές για κινητά, προγράμματα επιτραπέζιου υπολογιστή και άλλα. Επί αυτή τη στιγμή τρέχουσα έκδοσηείναι το Sketch 3. Μέσα σε αυτά τα 3,5 χρόνια, η Bohemian Coding έχει κάνει καλή δουλειάνα βελτιώσει το προϊόν της, διόρθωσε πολλά σφάλματα, αύξησε τη λειτουργικότητα και στην πραγματικότητα έγινε ένας σοβαρός ανταγωνιστής του Photoshop. Θέλω να κάνω μια σημαντική σημείωση αμέσως: δεν θεωρώ το Sketch ως άμεσο ανταγωνιστή Photoshop. Σαφώς, ο σκοπός αυτών των προγραμμάτων είναι αρχικά διαφορετικός, επομένως αυτό που θα είναι πλεονέκτημα για έναν μπορεί να είναι σοβαρό μειονέκτημα για έναν άλλο. Επομένως, θα ήταν σωστό να μην το κάνουμε συγκριτική ανασκόπηση, όπως κάνουν πολλοί, αλλά για να επισημάνουμε τα κύρια πλεονεκτήματα και ιδιότητες του καθενός από τους συντάκτες για μια συγκεκριμένη περίπτωση.

Σκοπός


Γι' αυτό πιστεύω ότι είναι σωστό να δείξουμε τον σκοπό καθενός από τα προγράμματα ως πρώτο σημείο.
Το Photoshop λειτουργεί κυρίως με εικόνες ράστερ , ωστόσο έχει μερικά διανυσματικά εργαλεία. Είναι απαραίτητο για ρετουσάρισμα φωτογραφιών και επεξεργασία εικόνας. Αλλά η λειτουργικότητα που έχει σχεδιαστεί για να λειτουργεί διανυσματικά γραφικάείναι αρκετά συμβατικό. Πολλοί θαυμαστές της Adobe θα αντιταχθούν σε εμένα, αλλά τότε προκύπτει μια λογική ερώτηση: γιατί η Adobe έχει ξεχωριστό διανυσματικό πρόγραμμα επεξεργασίας Illustrator, αν το Photoshop μπορεί να κάνει τα πάντα; Είναι η παρουσία δύο διεπαφών που περιπλέκει την εργασία και απαιτεί επιπλέον χρόνο κατά την επίλυση προβλημάτων με διανυσματικά γραφικά.
Το Sketch σχεδιάστηκε αρχικά για να λειτουργεί με διανύσματα, καθώς η ανάπτυξη διεπαφής περιλαμβάνει τη δημιουργία πρωτοτύπων, πλαισίων, εικονιδίων, στοιχείων διεπαφής χρήστη και συχνά αυτά τα στοιχεία πρέπει να είναι διανυσματικά.
Έτσι, για να επιλέξετε ποιο πρόγραμμα επεξεργασίας θα χρησιμοποιήσετε, πρέπει να καταλάβετε ποιες εργασίες θα πρέπει να επιλυθούν χρησιμοποιώντας αυτή η εργαλειοθήκη.

Τιμή


Η δεύτερη πιο σημαντική, αλλά όχι η πιο σημαντική, παράμετρος για την επιλογή ενός συγκεκριμένου επεξεργαστή είναι το κόστος και ο τρόπος πληρωμής για αυτό λογισμικό. Μπορείτε να αγοράσετε Photoshop αποκλειστικά με συνδρομή! Το κόστος της μηνιαίας χρήσης του editor είναι 20$ , και αυτός ο αριθμός μπορεί να διαφέρει για διαφορετικές περιοχές. Όμως η ουσία παραμένει η ίδια. Σε αντίθεση με την Adobe, η Bohemian Coding ακολούθησε τον αντίθετο δρόμο: το Sketch πωλείται για 99$ , αυτή είναι μια εφάπαξ πληρωμή και ο χρήστης λαμβάνει όλες τις ενημερώσεις δωρεάν. Ίσως στο μέλλον αλλάξει η οικονομική στρατηγική της εταιρείας, αλλά προς το παρόν κατακτούν την αγορά με αυτόν τον τρόπο. Είναι αυτός ο παράγοντας που σίγουρα θα παίξει ρόλο στην κλίμακα της εταιρείας. Αν και για τους ελεύθερους επαγγελματίες, ο οικονομικός προγραμματισμός των πόρων τους είναι επίσης σημαντικός.

Πολυπλατφόρμα


Ένα άλλο σημαντικό επιχείρημα για την επιλογή εργαλείων για τους σχεδιαστές θα είναι η πλατφόρμα στην οποία εκτελείται αυτό ή εκείνο το λογισμικό. Στην εταιρεία μας, οι σχεδιαστές εργάζονται αποκλειστικά συσκευές Macκαι η πλειοψηφία προγραμματιστές front-endΙδιο. Επομένως το γεγονός ότι Το Sketch είναι αποκλειστικό για το OS X, δεν μας έγινε πρόβλημα. Αλλά για σχεδιαστές που έχουν στη διάθεσή τους συσκευές Windows, αυτό σαφώς δεν είναι ένα επιλύσιμο ζήτημα. Φυσικά, μπορεί να μπερδευτείτε και να εγκαταστήσετε έναν εξομοιωτή OS X στα Windows, αλλά δεν μπορεί να προκύψει τίποτα καλό από αυτό, θα φορτώσετε τον επεξεργαστή σας και λειτουργικό σύστημαεπεξεργασία περιττές διαδικασίες. Σε αντίθεση με το Sketch, Το Photoshop έχει ξεχωριστές εκδόσειςγια Windows και OS X. Επομένως, στο θέμα της πολυπλατφόρμας, ο σταθερός ηγέτης παραμένει Adobe Photoshop. Αλλά, και πάλι, αυτό που με την πρώτη ματιά φαίνεται μειονέκτημα είναι ένα ισχυρό πλεονέκτημα σε συγκεκριμένες συνθήκες. Δεδομένου ότι το Sketch είναι διαθέσιμο μόνο για Mac, όλα είναι δημιουργημένο περιεχόμενοαποδίδεται με χρήση εργαλείων άξονα Mac, στάνταρ μηχανή γραφικώναπό την Apple. Έτσι οι προγραμματιστές πέτυχαν τη μέγιστη παραγωγικότητα και ταχύτητα εργασίας.

Ταχύτητα και μέγεθος του αρχείου λήψης


Ως εγγενής εφαρμογή Cocoa, το Sketch χρησιμοποιεί μη τυποποιημένα στοιχεία διεπαφής στο ελάχιστο, επομένως είναι μικρό σε μέγεθος. Αρχείο εκκίνησηςζυγίζει μόνο περίπου 22 MB. Είναι αρκετά καλά βελτιστοποιημένο, σε αντίθεση με το Photoshop, ο όγκος αρχείο εγκατάστασηςπου αφορά 1 GB.

Ενσωμάτωση


Ένα σημαντικό σημείο για κάθε εργαλειοθήκη είναι η ικανότητά του να ενσωματώνεται με άλλο λογισμικό. Για παράδειγμα, αφού αναπτυχθεί πλήρως η διάταξη του ιστότοπου και είναι έτοιμη για μεταφορά στο τμήμα ανάπτυξης front-end, το ερώτημα τίθεται σχετικά με τη μεταφορά του ίδιου του πηγαίου κώδικα για περαιτέρω ανάπτυξηέργο. Σήμερα, τόσο το Sketch όσο και το Photoshop διαθέτουν σοβαρά εργαλεία ενοποίησης. Και οι δύο συντάκτες μπορούν να εξάγουνυλικά σε λογισμικό για επικοινωνία μεταξύ προγραμματιστών και σχεδιαστών, όπως Avocode, Zeplin και άλλα. Αν εξετάσουμε αυτή την περίπτωση για μια εταιρεία, τότε αυτή την απόφασηεξαιρετικά σημαντικό, βοηθά στην εξοικονόμηση χρημάτων σε επιπλέον αντίγραφα συντάκτες γραφικώνγια προγραμματιστές front-end.

Εκπαίδευση


Εάν αποφασίσετε να κατακτήσετε το Photoshop ή να επεκτείνετε τις γνώσεις σας σχετικά με αυτό το πρόγραμμα επεξεργασίας γραφικών, τότε στη διάθεσή σας πολλές εκπαιδευτικές πηγές. Υπάρχουν εκπαιδευτικοί πόροι, τόσο επί πληρωμή όσο και δωρεάν. Η ποιότητα των υλικών ποικίλλει επίσης πολύ: από πρωτόγονα άρθρα από μη έγκυρους συγγραφείς έως τέλεια δομημένα διαδοχικά μαθήματα βίντεο από καταρτισμένους επαγγελματίες εκπαιδευτές. Λόγω του γεγονότος ότι το Sketch είναι ένα σχετικά νέο λογισμικό, αυτό ο αριθμός των πόρων κατάρτισης είναι ασύγκριτα μικρότεροςπαρά Photoshop. Και, κατά κανόνα, αυτά είναι υλικά επί πληρωμή. Για παράδειγμα, στο διάσημο εκπαιδευτικό πόροΤο Udemi έχει λιγότερα από 40 μαθήματα Sketch. Ωστόσο, υπάρχουν ήδη κριτικές από επαγγελματίες του Sketch. Ελπίζω ότι με την πάροδο του χρόνου ο αριθμός του εκπαιδευτικού υλικού στο δίκτυο θα αυξηθεί ανάλογα με την αυξανόμενη δημοτικότητα του προγράμματος επεξεργασίας γραφικών Sketch.

Ο ανταγωνισμός είναι η κινητήρια δύναμη της προόδου

Υπάρχουν πολλές άλλες παράμετροι και Χαρακτηριστικά Photoshopκαι το Sketch, είναι αρκετά δύσκολο να τα καλύψουμε όλα, αλλά το συμπέρασμα είναι σαφές: καθένας από τους γραφικούς επεξεργαστές που εξέτασα είναι καλός για επίλυση συγκεκριμένο έργο. Αν σκεφτούμε την ανάπτυξη διεπαφών, τότε στην εταιρεία μας κάναμε μια σαφή επιλογή υπέρ του Sketch. Αυτό διευκολύνθηκε από ένα σύνολο παραγόντων που αναφέρονται σε αυτό το άρθρο. Το Photoshop εξακολουθεί να είναι ο ηγέτης στην εργασία ράστερ γραφικά, αλλά δεν μπορεί κανείς να αγνοήσει το γεγονός ότι η εμφάνιση του Sketch έδωσε ισχυρή ώθηση σε Ανάπτυξη Photoshop. Η πιο εντυπωσιακή απόδειξη αυτού είναι η εμφάνιση πολλών πινάκων τέχνης και η δυνατότητα εμφάνισης προεπισκοπήσεων σε κινητή συσκευή. Πράγματι: ο ανταγωνισμός είναι η κινητήρια δύναμη της προόδου.

Γεια σε όλους, είμαι ο Oleynik Anton - σχεδιαστής διεπαφής, θαυμαστής του Sketch και ένας από τους συγγραφείς του θεματικού έργου sketchapp.me. Στο σημερινό ανάρτηση επισκέπτηΘα σας πω λεπτομερώς για αυτό το πρόγραμμα επεξεργασίας γραφικών για Mac OS.

Παρά το γεγονός ότι το Sketch έχει ήδη εδραιωθεί σε πολλές γνωστές ομάδες, συχνά βλέπω σχεδιαστές (ειδικά με εμπειρία) που δεσμεύονται τόσο στενά από μακροχρόνιες συνήθειες με τα παλιά τους εργαλεία που τις συζητούν ακόμη και αρνητικά. εναλλακτικές επιλογές(και δεν γίνεται λόγος για εφαρμογή στη διαδικασία της εργασίας). Εάν είστε ένας από αυτούς που αμφιβάλλουν, καλώς ήρθατε.

Έτσι, εδώ είναι μερικοί από τους πιο σημαντικούς λόγους για να δοκιμάσετε ακόμη και μια όχι και τόσο νέα εφαρμογή Sketch.

Σκίτσο - πρόγραμμα επεξεργασίας γραφικών για Mac OS

Ναι, αυτό συνήθως αναφέρεται ως μεγάλο μείον. Στην πραγματικότητα, αυτό είναι ένα μεγάλο πλεονέκτημα της εφαρμογής, γιατί την χρησιμοποιεί πλήρως εργαλεία συστήματος OS X (αυτόματη αποθήκευση, σχέδιο, απόδοση κειμένου). Στα Windows θα έπρεπε να υποφέρετε με το Sketch όπως και με οποιοδήποτε άλλο μεγάλο πρόγραμμαγια γραφικά.

Δεν λειτουργεί με ράστερ

Όλα καταγράφονται επίσης ως μείον. Φυσικά, είναι ακριβώς το αντίθετο. Σκίτσο - διάνυσμα και για σχεδιασμό διεπαφής. Αυτό δεν είναι πρόγραμμα ρετουσάρισμα φωτογραφιών. Λοιπόν, νομίζω ότι κανείς δεν σχεδιάζει διεπαφές σε ράστερ εδώ και εκατό χρόνια.

Μικρά αρχεία

Τα έγγραφα στο πρόγραμμα επεξεργασίας Sketch ζυγίζουν σημαντικά λιγότερο από τα αρχεία ai ή psd (και πάλι, χάρη στη χρήση πόρων λογισμικού συστήματος στο Mac).

Για παράδειγμα, το αρχείο btn.sketch με ένα κουμπί ζυγίζει 33 KB, το ίδιο btn.ai ζυγίζει 194 KB, το ίδιο btn.psd ζυγίζει 91 KB. Αυτά τα έγγραφα είναι μικρά, αλλά μπορείτε ήδη να υπολογίσετε κατά προσέγγιση την αναλογία.

Απλή διεπαφή Sketch

Με την πρώτη ματιά, θα νομίζετε ότι έχετε ανοίξει κάτι σαν το Keynote. Ναι, τόσο καθαρό εμφάνισηΤο επαγγελματικό (!) πρόγραμμα είναι λίγο μπερδεμένο για τους τύπους που έχουν συνηθίσει να στοχεύουν το ποντίκι τους για μεγάλο χρονικό διάστημα στα πλαίσια ελέγχου σε αμέτρητους πίνακες λογισμικού από την Adobe. Ωστόσο, αυτό ακριβώς συμβαίνει όταν λιγότερα = περισσότερα. Αυτή η απλή διεπαφή σάς δίνει χρόνο να σκεφτείτε τη δουλειά σας και όχι το εργαλείο.

Λίγα λόγια για τη διεπαφή

Στα αριστερά βρίσκεται ο πίνακας στρώσεων. Είναι λίγο ασυνήθιστο μετά το Photoshop, αλλά το συνηθίζεις γρήγορα. Στην κορυφή αυτού του πίνακα υπάρχει μια λίστα σελίδων. Μπορεί να αλλάξει στην κατάσταση "ανοιχτό" - βολικό εάν δεν υπάρχουν πολλές σελίδες στο αρχείο.

[Σκίτσο του πίνακα επιπέδων εφαρμογής]

Στο επάνω μέρος υπάρχει μια γραμμή εργαλείων ("γραμμή εργαλείων"). Όπως και άλλα προγράμματα στο Mac, μπορεί να προσαρμοστεί σύμφωνα με τις προτιμήσεις σας. Δεν υπάρχουν πολλά εργαλεία, και πλέοναπό αυτά θα απομνημονεύσετε στο πληκτρολόγιο.

Στα δεξιά πλαίσιο περιβάλλοντος(ας το πούμε έτσι). Ένα πολύ παρόμοιο, μόνο οριζόντιο, ήταν στα τελευταία Πυροτεχνήματα. Ο πίνακας αλλάζει ανάλογα με το τι κάνετε στον καμβά. Υπάρχουν τρεις τρόποι - ιδιότητες ομάδας, ιδιότητες σχήματος, ιδιότητες κειμένου.

Σελίδες και καμβάδες

Ένα έγγραφο Sketch χωρίζεται σε σελίδες. Οι σελίδες χωρίζονται με τη σειρά τους σε καμβάδες. Αυτό κάνει την οργάνωση των οθονών των εφαρμογών σας εξαιρετικά βολική. Για παράδειγμα, δημιουργείτε μια σελίδα "Σύνδεση" και μέσα υπάρχουν αρκετοί καμβάδες με διαφορετικά κράτηΟθόνη "Είσοδος".

Κατ 'αρχήν, το Photoshop και το Illustrator μπορούν ήδη να αποθηκεύσουν πολλούς καμβάδες σε ένα έγγραφο, αλλά εξακολουθούν να μην έχουν ένα επιπλέον επίπεδο (σελίδες, π.χ.)

Πλήρης δέσμευση στα pixel των πάντων και όλων

Το Sketch είναι πολύ προσεκτικό για να διασφαλίζει ότι όλα ταιριάζουν σε τέλεια pixel. Αν κάτι είναι θολό κάπου, υπάρχει ένας εύκολος τρόπος να το διορθώσετε.

Στυλ

Η εφαρμογή Sketch, φυσικά, έχει τόσο στυλ γραφικών όσο και στυλ κειμένου. Λειτουργούν, πάλι, στην αρχή λίγο συνηθισμένα: όταν ενημερώνετε το στυλ ενός αντικειμένου κάπου (αλλάξτε την πινελιά, το χρώμα, τη γραμματοσειρά), το στυλ ενημερώνεται αυτόματα παντού. Δεν υπάρχουν κουμπιά "Ενημέρωση στυλ".

Τα σύμβολα του προγράμματος επεξεργασίας σκίτσων μοιάζουν πολύ με τα σύμβολα του Photoshop και λίγο με τα σύμβολα του Illustrator. Το σύμβολο εδώ είναι ένας φάκελος (μόνο διαφορετικού χρώματος), μέσα στον οποίο μπορεί να υπάρχει οτιδήποτε, αλλά όχι άλλο σύμβολο. Λειτουργεί με τον ίδιο τρόπο όπως τα στυλ: ενημερώνεται σε ένα μέρος, ενημερώνεται αυτόματα παντού.

Υπάρχει μια ελαφρώς συγκεχυμένη και όχι επίσημα τεκμηριωμένη τεχνική για την ένθεση ορισμένων χαρακτήρων μέσα σε άλλους, αλλά περισσότερο σε αυτό μια άλλη φορά.

Βολική εξαγωγή

Η εξαγωγή γραφικών είναι πολύ απλή και βολική. Κάθε στοιχείο έχει μια ενέργεια "Make Exportable" όπου μπορείτε να επιλέξετε απαιτούμενες μορφέςκαι μεγέθη τελικά αρχεία. Υπάρχουν επίσης γνωστές φέτες για τη χειροκίνητη επιλογή μιας περιοχής για εξαγωγή.

Ένα πολύ βολικό σημείο στην εξαγωγή είναι η επιλογή πολλών μορφών και μεγεθών ταυτόχρονα.

Καθαρά

Το πρόγραμμα επεξεργασίας γραφικών Sketch έχει ενσωματωμένο και εύκαμπτο πλέγμα. Δεν χρειάζεται να επισημάνετε τη διάταξή σας με μη αυτόματο τρόπο ή χρησιμοποιώντας προσθήκες τρίτων. Τα πάντα υποστηρίζονται από το κουτί και μπορούν να προσαρμοστούν για να ταιριάζουν σε οποιεσδήποτε ανάγκες ανά πάσα στιγμή.

Απόδοση κειμένου συστήματος

Χάρη στο γεγονός ότι το Sketch χρησιμοποιεί πόρους του συστήματοςγια την απόδοση γραφικών, το κείμενο σε αυτό μοιάζει ακριβώς με αυτό που θα φαίνεται στο πρόγραμμα περιήγησης σε ένα "ζωντανό" προϊόν.

Σκίτσο προσθηκών για όλες τις περιπτώσεις

Όπως όλες οι καλές εφαρμογές, το Sketch έχει επίσης επεκτάσεις. Οι ενέργειες κυμαίνονται από απλές (τακτοποίηση επιλεγμένων αντικειμένων σε βήματα των 10 pixel) έως πολύπλοκες (βρείτε όλα τα επίπεδα κειμένου σε ένα έγγραφο με τη λέξη "Adobe" και αντικαταστήστε το με "Adobe", χωρίς διάκριση πεζών-κεφαλαίων). Εάν ένα πρόγραμμα δεν μπορεί να κάνει κάτι πολύ απαραίτητο, τότε πιθανότατα «υπάρχει πρόσθετο γιαότι".

Για να εγκαταστήσετε ένα πρόσθετο στο Sketch, κατεβάστε το (συνήθως από το GitHub του προγραμματιστή) και απλώς κάντε διπλό κλικ σε αυτό ή μετακινήστε το στο φάκελο Plugins. Ανοίξτε το φάκελο: μενού Προσθήκες-> Αποκάλυψη φακέλου προσθηκών…

[Εμφάνιση φακέλου προσθηκών στο Sketch]

Στη συνέχεια, στο μενού Προσθήκες θα έχετε ένα στοιχείο που αντιστοιχεί στην πιο πρόσφατη προσθήκη

Λίστα επεκτάσεων για να ξεκινήσετε με:

  • Εντολές Sketch - ένα μεγάλο πακέτο επεκτάσεων, χρήσιμο σε πολλές περιπτώσεις.
  • Μετονομάστε το - για εύκολη και γρήγορη ονομασία και μετονομασία επιπέδων.
  • Content Generator - γεννήτρια φωτογραφιών, κειμένων, ονομάτων, γεωγραφικών ονομάτων.

Μπορεί να χρειαστείτε λίγο Εφαρμογή εργαλειοθήκη, που θα διευκολύνει την εγκατάσταση/απεγκατάσταση προσθηκών για το Sketch.

Σύντομη περίοδος εκπαίδευσης

Φυσικά, υπάρχουν διαδικτυακά μαθήματα σε αυτό το πρόγραμμα επεξεργασίας γραφικών για Mac OS (φαίνεται ότι υπάρχουν ακόμη και μαθήματα επί πληρωμή), αλλά κατ 'αρχήν, μόνο μερικές ώρες θα είναι αρκετές για να καταλάβετε μόνοι σας όλα τα πιο σημαντικά. σημαντικές λεπτομέρειες. Στην αρχή θα είναι ασυνήθιστο, αλλά μόνο επειδή θα το συγκρίνετε με το Photoshop.

Επίλογος

Τι μπορούμε να πούμε στο τέλος της κριτικής Sketch; - Φυσικά, δεν είναι ιδανικός. Μερικές φορές υπάρχουν φρένα, κάποιες λειτουργίες λείπουν (χωρίς ράστερ), αλλά ακόμα και σε αυτήν την κατάσταση μπορεί να διευκολύνει και να επιταχύνει σημαντικά την ανάπτυξη του σχεδιασμού σας.

Μπορείτε να κατεβάσετε το πρόγραμμα Sketch και επίσης να μάθετε τα πάντα για το πρόγραμμα επεξεργασίας Sketch στον ιστότοπο

Ανάπτυξη σύγχρονες εφαρμογέςείναι αδιανόητο χωρίς τη δουλειά ενός σχεδιαστή και ένας σχεδιαστής χρειάζεται κατάλληλο λογισμικό για να λειτουργήσει. Χρησιμοποιείται κυρίως για την ανάπτυξη σχεδιασμού Adobe Illustrator, Photoshop και άλλους επαγγελματίες επεξεργαστές γραφικών, αλλά υπάρχουν και εξειδικευμένες λύσεις. Η τρίτη έκδοση του διανυσματικού προγράμματος επεξεργασίας Sketch κυκλοφόρησε πρόσφατα, που επικεντρώνεται κυρίως στη δημιουργία γραφικών για προγράμματα. Τι κάνει αυτό το εξειδικευμένο διανυσματικό πρόγραμμα επεξεργασίας διαφορετικό;

Είναι σαν οι προγραμματιστές του Sketch να πήραν ένα ισχυρό πρόγραμμα επεξεργασίας διανυσματικών γραφικών και να πέταξαν έξω όλα τα περιττά πράγματα. Στη συνέχεια το σκεφτήκαμε και το συμπληρώσαμε με όλα όσα είναι απαραίτητα για τη δημιουργία γραφικών κατά την ανάπτυξη του προγράμματος. Είναι αυτά τα πολλά βολικά «κόλπα» που ξεχωρίζουν το πρόγραμμα από άλλους συντάκτες. Αξίζει να σημειωθεί ότι το λογισμικό Sketch δεν περιορίζεται μόνο στα γραφικά, μπορεί να χρησιμοποιηθεί, για παράδειγμα, για σχεδιασμό ιστοσελίδων (λειτουργίες όπως το "στυλ αντιγραφής ως CSS" βοηθούν σε αυτό), αλλά και πάλι αυτός είναι ο κύριος σκοπός.

Επειδή το Sketch είναι μια εγγενής εφαρμογή OS X, μπορείτε πάντα να χρησιμοποιείτε το iCloud και τοπικές εκδόσειςέγγραφα. Το πρόγραμμα είναι πολύ ελαφρύ, γρήγορο και με απόκριση.

Παρεμπιπτόντως, το Sketch είναι τόσο καλό που το χρησιμοποιούν ακόμη και οι προγραμματιστές της Adobe :)

Ονομα:Σκίτσο 3
Εκδότης/Προγραμματιστής: Bohemian Coding
Τιμή: 2690 τρίψτε.
Αγορές εντός εφαρμογής:Οχι
Κατεβάστε:

Δεν έχει σημασία αν είστε εντελώς αρχάριος, σχεδιαστής στην εκπαίδευση ή έμπειρος επαγγελματίας που αλλάζετε Καινουργιο ΠΡΟΪΟΝ, - αυτό το άρθρο είναι για εσάς.

Πρώτα, θα γνωρίσουμε λίγο το Sketch - τι είναι, πώς απέκτησε τη δημοτικότητά του, πώς να αποκτήσετε μια δωρεάν δοκιμαστική έκδοση και να εγκαταστήσετε την εφαρμογή σε Mac. κατα δευτερον, ας εξερευνήσουμε τη διεπαφή Sketch, θα εξηγήσω τα βασικά και θα δείξω μερικά κόλπα και κόλπα. Τρίτος, θα θίξουμε πιο προηγμένες λειτουργίες της εφαρμογής (οι καμπύλες Bézier και το blending είναι ιδιαίτερα εντυπωσιακές).

Και τελικά, θα μοιραστώ ποιοτικούς πόρους Sketch, συμπεριλαμβανομένων δωρεάν φύλλο εξαπάτησης 99 βαθμοί, που είναι πολύ βολικό για να μάθετε πώς να χρησιμοποιείτε την εφαρμογή. Ακούγεται καλό;

1. Γιατί το Sketch;

Για ένα διάστημα μετά την κυκλοφορία του το 2010, το Sketch θεωρήθηκε ως ένα ελαφρύ εργαλείο επεξεργασίας γραφικών με το οποίο οι σχεδιαστές UI και UX μπορούσαν να δημιουργήσουν γρήγορα πρωτότυπα σχέδια εφαρμογών.

Αλλά τα τελευταία χρόνιαΤο Sketch έχει εξελιχθεί σημαντικά και οι δυνατότητές του εκτείνονται πλέον πολύ πέρα ​​από τη δημιουργία μακέτας οθόνης. Ως νεανικό προϊόν που δημιουργήθηκε ειδικά για τις ανάγκες σήμερα, δεν τα έχει όλα αυτά περιττά σκουπίδια, όπως σε ένα σύνολο προϊόντων Adobe CreativeΣύννεφο.

  • Αλλαγή μεγέθους σχημάτων με χρήση πλήκτρων πρόσβασης
  • Αντιγραφή στοιχείων
  • Έξυπνη επισήμανση
  • Ομαδοποίηση και κατάργηση ομαδοποίησης στοιχείων
  • Άμεση επιλογή σε ομάδες
  • Ρύθμιση ζουμ 100%.
  • Εμφάνιση όλων των πινάκων τέχνης
  • Φέρνοντας αντικείμενα στο προσκήνιο ή στο παρασκήνιο
  • Μετονομασία
  • Μέτρηση της απόστασης μεταξύ των στοιχείων
  • Ρυθμίστε την αδιαφάνεια χρησιμοποιώντας αριθμητικό πληκτρολόγιο
  • Αλλαγή της ακτίνας κάθε γωνίας ξεχωριστά
  • Ρύθμιση προσαρμοσμένων πλήκτρων πρόσβασης
  • Χρήση μαθηματικές πράξειςμέσα στα πεδία εισαγωγής
  • Σύνθετα σχήματα
  • Εντολή περιστροφής αντιγραφής
  • Φέτες
  • Εξαγώγιμα στοιχεία και πίνακες τέχνης
  • Εξαγωγή πηγών για οθόνες αμφιβληστροειδούς
  • Τοποθέτηση αντικειμένων «εξωτερικά»
  • Συνδυασμός φωτός και σκιάς για τη δημιουργία βάθους
  • Απομίμηση διπλωμένης επιφάνειας
  • Δημιουργία αιχμηρών σκιών
  • Απόσταση μεταξύ ενός αντικειμένου και της σκιάς του
  • Πολλαπλές πηγές φωτός
  • Γραμμή ορίζοντα
  • Επικάλυψη αντικειμένου

Και τέλος... δουλέψτε μέσα από αυτά τα μαθήματα Σκίτσου. Είναι στα ρωσικά

Μια σειρά από μαθήματα από τον Marc Andrew

Δημιουργία εφαρμογών για κινητά στο Sketch από τον Marc Andrew

Αν ψάχνετε για περισσότερα μαθήματα και συμβουλές για να ξεκινήσετε στο Sketch, θα τα βρείτε στο " Επιπρόσθετοι πόροι» στο τέλος αυτής της ανάρτησης.

3. Πιο προηγμένες τεχνικές για εργασία στο Sketch

Αφού καταλάβετε τα βασικά, ήρθε η ώρα να προχωρήσετε στις πιο προηγμένες λειτουργίες που είναι διαθέσιμες στους χρήστες του Sketch!

Κατακτώντας τις καμπύλες Bezier

Όπως ανέφερα προηγουμένως, το Sketch είναι ένα διανυσματικό πρόγραμμα επεξεργασίας γραφικών, που σημαίνει ότι όλα τα αντικείμενα στο Sketch αποτελούνται από σημεία και καμπύλες. Για να γνωρίσετε την πλήρη αξία του Sketch, πρέπει να μάθετε πώς να χειρίζεστε αυτά τα σημεία και τις καμπύλες. Αυτό θα σας επιτρέψει να σχεδιάσετε σύνθετα σχήματα, όπως περίτεχνα γράμματα, από την αρχή.

Δημιουργία συμβόλων

Το Sketch σας επιτρέπει να δημιουργήσετε τα δικά σας "σύμβολα". Αυτό σημαίνει ότι μπορείτε να αποθηκεύσετε ένα επίπεδο ή μια ομάδα επιπέδων ως σύμβολο και στη συνέχεια να το εισαγάγετε στο έγγραφό σας σαν να ήταν ένα απλό σχήμα.

Αυτό που κάνει τα σύμβολα ιδιαίτερα είναι ότι μπορείτε να κάνετε διπλό κλικ στην «οντότητα» ενός συμβόλου, να επεξεργαστείτε το σύμβολο «κύριο» και όλες οι οντότητες αυτού του συμβόλου στο έγγραφο θα ενημερωθούν αυτόματα. Σε αυτό το GIF, δημιουργώ ένα σύμβολο σε σχήμα φύλλου, εισάγω δύο ακόμη από τις οντότητές του και, στη συνέχεια, αλλάζω την αδιαφάνεια του γονικού συμβόλου. Δείτε πώς αλλάζουν τα υπόλοιπα:

Προηγμένες επιλογές αλλαγής μεγέθους

Όταν εργάζεστε με ομαδοποιημένα αντικείμενα, μπορεί να θέλετε τα αντικείμενα της ομάδας να συμπεριφέρονται διαφορετικά όταν αλλάζουν μέγεθος. Για κάθε αντικείμενο μέσα στην ομάδα, το Sketch σάς επιτρέπει να επιλέξετε τη δική σας μέθοδο αλλαγής μεγέθους.

Εδώ πιθανές επιλογές:

  • Τέντωμα(stretch): Το μέγεθος του αντικειμένου θα αλλάξει ανάλογα με το συνολικό μέγεθος της ομάδας. Αυτή είναι η προεπιλεγμένη μέθοδος, συνήθως αυτό είναι το αποτέλεσμα που περιμένετε από μια αλλαγή μεγέθους.
  • Καρφώστε στη γωνία(προσάρτηση στη γωνία): Το μέγεθος του αντικειμένου θα αλλάξει, αλλά η θέση του δεν θα αλλάξει (σε ​​σχέση με την πλησιέστερη γωνία)
  • Αλλαγή μεγέθους αντικειμένου(αλλαγή μεγέθους αντικειμένου): Το μέγεθος του αντικειμένου θα αλλάξει στην ίδια τιμή pixel στην οποία αλλάζει το μέγεθος της ομάδας. Εάν η ομάδα γίνει 50 px ευρύτερη, τότε το αντικείμενο θα γίνει 50 px ευρύτερο.
  • Επιπλέουν στη θέση τους: το μέγεθος του αντικειμένου δεν θα αλλάξει όταν αλλάξει το μέγεθος της ομάδας, αλλά θα αλλάξει τη θέση του ανάλογα με τις συνολικές διαστάσεις της ομάδας.

Πρόσφατα, το ζήτημα των εργαλείων για τους ειδικούς UI/UX έχει γίνει πολύ οξύ: ποιο λογισμικό πρέπει να χρησιμοποιείται για την ανάπτυξη διεπαφών; Και εμείς στην εταιρεία μας συζητάμε θερμά αυτό το θέμα. Και οι συζητήσεις είναι συχνά πολύ έντονες. Τι να επιλέξετε για δουλειά; Ποιος επεξεργαστής είναι πιο λειτουργικός για την εργασία ενός συγκεκριμένου σχεδιαστή; Ο κατάλογος των εργασιών μας είναι αρκετά ευρύς, από τη δημιουργία εταιρικής ταυτότητας έως τον πλήρη κύκλο ανάπτυξης σύνθετων ψηφιακών προϊόντων. Για παράδειγμα, εφαρμογές για κινητά για τη διαχείριση συστημάτων έξυπνου σπιτιού, συστήματα ηλεκτρονικού εμπορίου με πλήρη χαρακτηριστικά.
Δεν θα είμαι ο πρώτος που θα θέσω αυτά τα ερωτήματα, αλλά θα προσπαθήσω να δώσω συνοπτικές απαντήσεις σε αυτά. Ίσως το άρθρο μου να ενδιαφέρει αρχάριους σχεδιαστές που δεν έχουν ακόμη αποφασίσει οριστικά την κατεύθυνση της δραστηριότητάς τους ή σχεδιαστές που θέλουν να επανεκπαιδευτούν από τη μια ειδικότητα στην άλλη.


Τα τελευταία είκοσι χρόνια, το Adobe Photoshop παραμένει το πιο δημοφιλές πρόγραμμα επεξεργασίας γραφικών για τους σχεδιαστές. Ωστόσο, πρόσφατα το πρωτάθλημα της εταιρείας Πλίθαστην αγορά εργαλείων για ψηφιακούς σχεδιαστές κλονίστηκε, το 2012 η εταιρεία Bohemian Codingκυκλοφόρησε Σκίτσο. Σκίτσοείναι ένα επαγγελματικό πρόγραμμα επεξεργασίας διανυσματικών γραφικών σχεδιασμένο ειδικά για τη δημιουργία γραφικών διεπαφών: web, εφαρμογές για κινητά, προγράμματα επιτραπέζιου υπολογιστή και άλλα. Αυτή τη στιγμή, η τρέχουσα έκδοση είναι το Sketch 3. Μέσα σε αυτά τα 3,5 χρόνια, η Bohemian Coding έχει κάνει πολλή δουλειά για να βελτιώσει το προϊόν της, διόρθωσε πολλά σφάλματα, αύξησε τη λειτουργικότητα και, στην πραγματικότητα, έγινε σοβαρός ανταγωνιστής του Photoshop. Θέλω να κάνω μια σημαντική σημείωση αμέσως: δεν θεωρώ το Sketch ως άμεσο ανταγωνιστή Photoshop. Σαφώς, ο σκοπός αυτών των προγραμμάτων είναι αρχικά διαφορετικός, επομένως αυτό που θα είναι πλεονέκτημα για έναν μπορεί να είναι σοβαρό μειονέκτημα για έναν άλλο. Ως εκ τούτου, θα ήταν σωστό να μην κάνουμε μια συγκριτική ανασκόπηση, όπως κάνουν πολλοί, αλλά να επισημάνουμε τα κύρια πλεονεκτήματα και ιδιότητες του καθενός από τους συντάκτες για μια συγκεκριμένη περίπτωση.

Σκοπός


Γι' αυτό πιστεύω ότι είναι σωστό να δείξουμε τον σκοπό καθενός από τα προγράμματα ως πρώτο σημείο.
Το Photoshop λειτουργεί κυρίως με εικόνες ράστερΩστόσο, έχει κάποια διανυσματικά εργαλεία. Είναι απαραίτητο για ρετουσάρισμα φωτογραφιών και επεξεργασία εικόνας. Αλλά η λειτουργικότητα που προορίζεται για εργασία με διανυσματικά γραφικά είναι αρκετά υπό όρους. Πολλοί θαυμαστές της Adobe θα αντιταχθούν σε μένα, αλλά τότε τίθεται ένα λογικό ερώτημα: γιατί η Adobe έχει ένα ξεχωριστό διανυσματικό πρόγραμμα επεξεργασίας, το Illustrator, στο οπλοστάσιό της, αν το Photoshop μπορεί να κάνει τα πάντα; Είναι η παρουσία δύο διεπαφών που περιπλέκει την εργασία και απαιτεί επιπλέον χρόνο κατά την επίλυση προβλημάτων με διανυσματικά γραφικά.
Το Sketch σχεδιάστηκε αρχικά για να λειτουργεί με διανύσματα, καθώς η ανάπτυξη διεπαφής περιλαμβάνει τη δημιουργία πρωτοτύπων, πλαισίων, εικονιδίων, στοιχείων διεπαφής χρήστη και συχνά αυτά τα στοιχεία πρέπει να είναι διανυσματικά.
Έτσι, για να επιλέξετε ποιο πρόγραμμα επεξεργασίας θα χρησιμοποιήσετε, πρέπει να καταλάβετε ποιες εργασίες θα πρέπει να επιλυθούν χρησιμοποιώντας αυτήν την εργαλειοθήκη.

Τιμή


Η δεύτερη πιο σημαντική, αλλά όχι η πιο σημαντική, παράμετρος για την επιλογή ενός συγκεκριμένου προγράμματος επεξεργασίας είναι το κόστος και ο τρόπος πληρωμής για αυτό το λογισμικό. Μπορείτε να αγοράσετε Photoshop αποκλειστικά με συνδρομή! Το κόστος της μηνιαίας χρήσης του editor είναι 20$ , και αυτός ο αριθμός μπορεί να διαφέρει για διαφορετικές περιοχές. Όμως η ουσία παραμένει η ίδια. Σε αντίθεση με την Adobe, η Bohemian Coding ακολούθησε τον αντίθετο δρόμο: το Sketch πωλείται για 99$ , αυτή είναι μια εφάπαξ πληρωμή και ο χρήστης λαμβάνει όλες τις ενημερώσεις δωρεάν. Ίσως στο μέλλον αλλάξει η οικονομική στρατηγική της εταιρείας, αλλά προς το παρόν κατακτούν την αγορά με αυτόν τον τρόπο. Είναι αυτός ο παράγοντας που σίγουρα θα παίξει ρόλο στην κλίμακα της εταιρείας. Αν και για τους ελεύθερους επαγγελματίες, ο οικονομικός προγραμματισμός των πόρων τους είναι επίσης σημαντικός.

Πολυπλατφόρμα


Ένα άλλο σημαντικό επιχείρημα για την επιλογή εργαλείων για τους σχεδιαστές θα είναι η πλατφόρμα στην οποία εκτελείται αυτό ή εκείνο το λογισμικό. Στην εταιρεία μας, οι σχεδιαστές εργάζονται αποκλειστικά σε συσκευές Mac και οι περισσότεροι προγραμματιστές front-end κάνουν το ίδιο. Επομένως το γεγονός ότι Το Sketch είναι αποκλειστικό για το OS X, δεν μας έγινε πρόβλημα. Αλλά για τους σχεδιαστές που έχουν συσκευές Windows στη διάθεσή τους, αυτό σαφώς δεν είναι ένα επιλύσιμο ζήτημα. Φυσικά, μπορείτε να μπερδευτείτε και να εγκαταστήσετε έναν εξομοιωτή OS X στα Windows, αλλά δεν μπορεί να προκύψει τίποτα καλό από αυτό, θα φορτώσετε τον επεξεργαστή και το λειτουργικό σας σύστημα επεξεργαζόμενοι περιττές διαδικασίες. Σε αντίθεση με το Sketch, Το Photoshop έχει ξεχωριστές εκδόσεις για Windows και OS X. Ως εκ τούτου, στο θέμα της πολλαπλής πλατφόρμας, το Adobe Photoshop παραμένει σταθερός ηγέτης. Αλλά, και πάλι, αυτό που με την πρώτη ματιά φαίνεται μειονέκτημα είναι ένα ισχυρό πλεονέκτημα σε συγκεκριμένες συνθήκες. Εφόσον το Sketch υπάρχει μόνο για Mac, όλο το περιεχόμενο που δημιουργείται αποδίδεται χρησιμοποιώντας τον άξονα Mac, χρησιμοποιώντας την τυπική μηχανή γραφικών της Apple. Έτσι οι προγραμματιστές πέτυχαν τη μέγιστη παραγωγικότητα και ταχύτητα εργασίας.

Ταχύτητα και μέγεθος του αρχείου λήψης


Ως εγγενής εφαρμογή Cocoa, το Sketch χρησιμοποιεί μη τυποποιημένα στοιχεία διεπαφής στο ελάχιστο, επομένως είναι μικρό σε μέγεθος. Το αρχείο λήψης ζυγίζει μόνο περίπου. 22 MB. Είναι αρκετά καλά βελτιστοποιημένο, σε αντίθεση με το Photoshop, το αρχείο εγκατάστασης του οποίου είναι περίπου 1 GB.

Ενσωμάτωση


Ένα σημαντικό σημείο για κάθε εργαλειοθήκη είναι η ικανότητά του να ενσωματώνεται με άλλο λογισμικό. Για παράδειγμα, αφού αναπτυχθεί πλήρως η διάταξη του ιστότοπου και είναι έτοιμη να μεταφερθεί στο τμήμα ανάπτυξης front-end, τίθεται το ερώτημα της απευθείας μεταφοράς του πηγαίου κώδικα για περαιτέρω ανάπτυξη του έργου. Σήμερα, τόσο το Sketch όσο και το Photoshop διαθέτουν σοβαρά εργαλεία ενοποίησης. Και οι δύο συντάκτες μπορούν να εξάγουνυλικά σε λογισμικό για επικοινωνία μεταξύ προγραμματιστών και σχεδιαστών, όπως Avocode, Zeplin και άλλα. Αν εξετάσουμε αυτήν την περίπτωση για μια εταιρεία, τότε αυτή η λύση είναι εξαιρετικά σημαντική, βοηθά στην εξοικονόμηση χρημάτων σε πρόσθετα αντίγραφα γραφικών επεξεργασίας για προγραμματιστές front-end.

Εκπαίδευση


Εάν αποφασίσετε να κατακτήσετε το Photoshop ή να επεκτείνετε τις γνώσεις σας σχετικά με αυτό το πρόγραμμα επεξεργασίας γραφικών, τότε στη διάθεσή σας πολλές εκπαιδευτικές πηγές. Υπάρχουν εκπαιδευτικοί πόροι, τόσο επί πληρωμή όσο και δωρεάν. Η ποιότητα των υλικών ποικίλλει επίσης πολύ: από πρωτόγονα άρθρα από μη έγκυρους συγγραφείς έως τέλεια δομημένα διαδοχικά μαθήματα βίντεο από καταρτισμένους επαγγελματίες εκπαιδευτές. Λόγω του γεγονότος ότι το Sketch είναι ένα σχετικά νέο λογισμικό, αυτό ο αριθμός των πόρων κατάρτισης είναι ασύγκριτα μικρότεροςπαρά Photoshop. Και, κατά κανόνα, αυτά είναι υλικά επί πληρωμή. Για παράδειγμα, ο γνωστός εκπαιδευτικός πόρος Udemi έχει λιγότερα από 40 μαθήματα Sketch. Ωστόσο, υπάρχουν ήδη κριτικές από επαγγελματίες του Sketch. Ελπίζω ότι με την πάροδο του χρόνου ο αριθμός του εκπαιδευτικού υλικού στο δίκτυο θα αυξηθεί ανάλογα με την αυξανόμενη δημοτικότητα του προγράμματος επεξεργασίας γραφικών Sketch.

Ο ανταγωνισμός είναι η κινητήρια δύναμη της προόδου

Υπάρχουν πολλές άλλες παράμετροι και χαρακτηριστικά του Photoshop και του Sketch, είναι αρκετά δύσκολο να τα καλύψουμε όλα, αλλά το συμπέρασμα είναι σαφές: καθένας από τους επεξεργαστές γραφικών που εξέτασα είναι καλός για την επίλυση μιας συγκεκριμένης εργασίας. Αν σκεφτούμε την ανάπτυξη διεπαφών, τότε στην εταιρεία μας κάναμε μια σαφή επιλογή υπέρ του Sketch. Αυτό διευκολύνθηκε από ένα σύνολο παραγόντων που αναφέρονται σε αυτό το άρθρο. Το Photoshop εξακολουθεί να είναι ο ηγέτης στην εργασία με ράστερ γραφικά, αλλά δεν μπορούμε να αγνοήσουμε το γεγονός ότι η εμφάνιση του Sketch έδωσε ισχυρή ώθηση στην ανάπτυξη του Photoshop. Η πιο εντυπωσιακή απόδειξη αυτού είναι η εμφάνιση πολλών πινάκων τέχνης και η δυνατότητα εμφάνισης προεπισκοπήσεων σε φορητή συσκευή. Πράγματι: ο ανταγωνισμός είναι η κινητήρια δύναμη της προόδου.

Έχετε ερωτήσεις;

Αναφέρετε ένα τυπογραφικό λάθος

Κείμενο που θα σταλεί στους συντάκτες μας: