{"id":2678,"date":"2018-06-21T16:55:55","date_gmt":"2018-06-21T20:55:55","guid":{"rendered":"http:\/\/www.softbec.ca\/aide\/?p=2678"},"modified":"2018-06-21T16:55:55","modified_gmt":"2018-06-21T20:55:55","slug":"editeur-dimages","status":"publish","type":"post","link":"https:\/\/www.softbec.ca\/aide\/editeur-dimages\/","title":{"rendered":"\u00c9diteur d’images"},"content":{"rendered":"

[vc_row][vc_column][vc_column_text]Un \u00e9diteur d’image\u00a0est accessible nativement dans l’application OTO Nom-i permettant aux utilisateurs de mieux concevoir les pamphlets et les catalogues de vos produits.\u00a0Cet \u00e9diteur propose de nombreuses fonctionnalit\u00e9s professionnels tel l’utilisation des calques, la transparence, les tons de couleurs et bien plus.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n

\n
\n
\n
Les principales fonctionnalit\u00e9s de l’\u00e9diteur sont accessibles via le ruban “Image”.<\/div>\n
<\/div>\n
\n
\"Ruban<\/div>\n
Fonctionnalit\u00e9s g\u00e9n\u00e9rales<\/strong><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n
\n
\n
\n
\n

 <\/p>\n

Les options du groupe “G\u00e9n\u00e9ral” du ruban “Image” permettent de manipuler l’image actuellement affich\u00e9e sous l’\u00e9diteur\u00a0:<\/p>\n

\"Groupe<\/div>\n

Il est possible de\u00a0:<\/p>\n

    \n
  • Redimensionner l’image<\/b>\u00a0: Il suffit d’indiquer dans la fen\u00eatre qui s’affiche la nouvelle taille ou le pourcentage d’agrandissement\/r\u00e9duction.\n
    \"Redimensionnement\"<\/div>\n

    Remarques\u00a0:<\/p>\n

      \n
    • Le redimensionnement est effectu\u00e9 pour le calque en cours. Si vous s\u00e9lectionnez le calque “Toute l’image”, le redimensionnement sera effectu\u00e9 pour tous les calques.<\/li>\n
    • Un clic sur la cha\u00eenette permet d’effectuer un redimensionnement non proportionnel.<\/li>\n<\/ul>\n<\/li>\n
    • Agrandir la zone de travail<\/b>\u00a0: Il suffit d’indiquer dans la fen\u00eatre qui s’affiche\u00a0:\n
      \"Agrandissement\"<\/div>\n
        \n
      • La nouvelle taille de l’espace de travail.<\/li>\n
      • Le mode d’agrandissement de l’image.<\/li>\n<\/ul>\n<\/li>\n
      • Rogner l’image<\/b>\u00a0: Cette option transforme le curseur de la souris en outil sp\u00e9cifique, permettant de s\u00e9lectionner la zone \u00e0 conserver. L’image est automatiquement rogn\u00e9e.<\/li>\n
      • Rotation<\/b>\u00a0: Permet d’effectuer une rotation du calque en cours (pr\u00e9d\u00e9finie ou personnalis\u00e9e).\n
        \"Rotation\"<\/div>\n<\/li>\n
      • Sym\u00e9trie<\/b>\u00a0: Permet d’effectuer une sym\u00e9trie du calque en cours (horizontale et\/ou verticale).\n
        \"Sym\u00e9trie\"<\/div>\n<\/li>\n<\/ul>\n<\/div>\n
        \n

        Manipulations g\u00e9n\u00e9rales\u00a0: ouverture, enregistrement, …<\/p>\n

        L’\u00e9diteur d’images propose \u00e9galement toutes les fonctionnalit\u00e9s standard\u00a0:<\/p>\n

          \n
        • soit via les boutons d’acc\u00e8s rapide (ouvrir, enregistrer, …).<\/li>\n
        • soit via le volet “Accueil” du ruban (ouvrir, enregistrer, enregistrer sous, fermer, …).<\/li>\n<\/ul>\n
          \n
          \n

          Pour imprimer l’image affich\u00e9e sous l’\u00e9diteur<\/b>\u00a0:<\/p>\n

            \n
          1. Utilisez\u00a0:\n
              \n
            • le bouton\u00a0\"Impression\"\u00a0pr\u00e9sent dans le volet “Accueil”.<\/li>\n
            • le raccourci CTRL P.<\/li>\n<\/ul>\n<\/li>\n
            • Sp\u00e9cifiez les caract\u00e9ristiques de l’impression dans la fen\u00eatre qui s’affiche et validez.<\/li>\n<\/ol>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

               <\/p>\n

              \n
              \n
              \n
              Zoom<\/div>\n
              \n

              Il est possible d’effectuer un zoom sur l’image via les options du zoom\u00a0:<\/p>\n

                \n
              1. Sous le volet “Image”, dans le groupe “Zoom”, cliquez sur “Zoom”.<\/li>\n
              2. S\u00e9lectionnez l’option voulue\u00a0:\n
                \"Options<\/div>\n<\/li>\n<\/ol>\n
                Il est \u00e9galement possible d’utiliser le raccourci CTRL++ pour effectuer un zoom vers l’avant et CTRL– pour effectuer un zoom vers l’arri\u00e8re.<\/div>\n
                \n

                Le volet “Images” permet \u00e9galement de r\u00e9aliser un zoom via le potentiom\u00e8tre de r\u00e9glage.<\/p>\n

                \"Volet<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

                Outils<\/p>\n

                \n
                \n
                \n
                \n

                L’\u00e9diteur d’images propose plusieurs outils pour manipuler l’image.<\/p>\n

                \"Outils\"<\/div>\n
                  \n
                • Crayon<\/b>\u00a0: Permet de tracer une ligne de forme quelconque en continue sur le calque en cours. Le trac\u00e9 d\u00e9bute d\u00e8s que le bouton gauche de la souris est enfonc\u00e9 puis suit le trajet de la souris. L’\u00e9paisseur du trait, la couleur peuvent \u00eatre d\u00e9finis dans les r\u00e9glages du volet “Images”, zone “Couleurs”.<\/li>\n
                • Trait<\/b>\u00a0: Permet de tracer un trait \u00e0 la souris sur le calque en cours. Le point de d\u00e9part est d\u00e9fini par le clic gauche. Le trait suit le d\u00e9placement de la souris. Le point d’arriv\u00e9e est d\u00e9fini par le rel\u00e2ch\u00e9 du bouton gauche. L’\u00e9paisseur du trait et la couleur peuvent \u00eatre d\u00e9finis dans les r\u00e9glages du volet “Images”, zone “Couleurs”.
                  \nRemarque\u00a0: l’appui sur la touche SHIFT pendant le trac\u00e9 du trait permet d’obtenir un trait horizontal ou vertical.<\/li>\n
                • Gomme<\/b>\u00a0: Permet d’effacer une partie de l’image sur le calque en cours. L’\u00e9paisseur de la gomme est d\u00e9finie dans les r\u00e9glages du volet “Images”, zone “Couleurs”.<\/li>\n
                • Texte<\/b>\u00a0: Permet de d\u00e9finir une zone de texte sur l’image. La zone de texte est d\u00e9finie par le clic gauche de la souris. La police, taille, cadrage, couleur, attributs du texte peuvent \u00eatre d\u00e9finis dans la barre de menu situ\u00e9e au dessus de la zone de texte.\n
                  \"Attributs<\/div>\n<\/li>\n
                • Remplissage<\/b>\u00a0: Permet de remplir une zone du calque en cours. Cette zone peut \u00eatre la totalit\u00e9 du calque, une zone d\u00e9finie par une s\u00e9lection, … La couleur de remplissage peut \u00eatre d\u00e9finie dans les r\u00e9glages du volet “Images”, zone “Couleurs”.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

                  S\u00e9lection<\/p>\n

                  \n
                  \n
                  \n
                  \n

                  L’\u00e9diteur d’images propose plusieurs outils pour r\u00e9aliser une s\u00e9lection\u00a0:<\/p>\n

                  \"Options<\/div>\n
                    \n
                  • Rectangle<\/b>\u00a0: Permet de s\u00e9lectionner une zone de forme rectangulaire du calque en cours \u00e0 l’aide de la souris. Le d\u00e9placement pour repr\u00e9senter la zone s’effectue en conservant le bouton gauche enfonc\u00e9. Le rel\u00e2ch\u00e9 du bouton gauche termine la zone de s\u00e9lection. La zone est repr\u00e9sent\u00e9e par un rectangle en pointill\u00e9s.<\/li>\n
                  • Lasso<\/b>\u00a0: Permet de s\u00e9lectionner une zone de forme quelconque du calque en cours \u00e0 l’aide de la souris. Le point de d\u00e9part est d\u00e9fini par le clic gauche de la souris. Le d\u00e9placement pour repr\u00e9senter la zone s’effectue en conservant le bouton gauche enfonc\u00e9. Le rel\u00e2ch\u00e9 du bouton gauche termine la zone de s\u00e9lection. La zone est repr\u00e9sent\u00e9e par un contour de couleur. Cette zone peut ensuite \u00eatre d\u00e9plac\u00e9e par l’outil de d\u00e9placement.<\/li>\n
                  • \n
                    \n

                    Baguette<\/b>\u00a0: Permet de s\u00e9lectionner une zone color\u00e9e de fa\u00e7on homog\u00e8ne sans \u00eatre oblig\u00e9 de tracer son contour. Il suffit de sp\u00e9cifier la tol\u00e9rance pour les s\u00e9lections effectu\u00e9es avec cet outil.<\/p>\n

                    \"Param\u00e9trage<\/div>\n

                    Plus la tol\u00e9rance est faible, moins la baguette va s\u00e9lectionner de couleurs et plus la tol\u00e9rance est \u00e9lev\u00e9e, plus la baguette va couvrir une large plage de couleurs.<\/p>\n<\/div>\n<\/li>\n<\/ul>\n

                      \n
                    • \n
                      \n

                      D\u00e9placer et redimensionner<\/b>\u00a0(CTRL T)\u00a0: Permet de\u00a0:<\/p>\n

                        \n
                      • d\u00e9placer le contenu du calque ou de la zone s\u00e9lectionn\u00e9e \u00e0 la souris. Le d\u00e9placement s’effectue \u00e0 l’aide de la souris en maintenant le bouton gauche enfonc\u00e9. Le rel\u00e2ch\u00e9 du bouton gauche valide le d\u00e9placement.<\/li>\n
                      • redimensionner le contenu du calque ou de la zone s\u00e9lectionn\u00e9e \u00e0 la souris. Le redimensionnement s’effectue \u00e0 l’aide de la souris, en utilisant les poign\u00e9es de la zone. Si la touche SHIFT est maintenue enfonc\u00e9e pendant le redimensionnement, les proportions sont conserv\u00e9es.<\/li>\n
                      • effectuer une rotation du calque ou de la zone s\u00e9lectionn\u00e9e \u00e0 la souris. Il suffit d’\u00e9loigner la souris des poign\u00e9es de de la zone pour afficher un curseur de rotation (double fl\u00e8che incurv\u00e9e). Il suffit alors de maintenir le bouton gauche de la souris enfonc\u00e9 pendant le d\u00e9placement dans le sens de la rotation voulue. Le rel\u00e2ch\u00e9 du bouton gauche valide la rotation.<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

                         <\/p>\n

                        \n
                        \n
                        \n
                        Transformation<\/div>\n
                        \n

                        L’\u00e9diteur d’images permet d’effectuer de nombreuses transformations sur l’image en cours\u00a0:<\/p>\n

                        \"Transformation\"<\/div>\n
                          \n
                        • Ic\u00f4ne<\/b>\u00a0: Permet de transformer l’image en cours en une ic\u00f4ne. Les diff\u00e9rents formats d’ic\u00f4ne propos\u00e9s par d\u00e9faut sont affich\u00e9s \u00e0 gauche de l’\u00e9diteur. Il est possible d’ajouter des formats sp\u00e9cifiques (bouton “+”), de supprimer des formats inutiles, de reg\u00e9n\u00e9rer les ic\u00f4nes en modifiant la taille de l’image de base.<\/li>\n
                        • \n
                          \n

                          Multi DPI<\/b>\u00a0: Permet de cr\u00e9er un jeu d’images correspondant aux diff\u00e9rents DPI . Les diff\u00e9rents DPI propos\u00e9s par d\u00e9faut sont affich\u00e9s \u00e0 gauche de l’\u00e9diteur. Il est possible d’ajouter des DPI sp\u00e9cifiques (bouton “+”), de supprimer des DPI inutiles, de reg\u00e9n\u00e9rer les images en modifiant la taille de l’image de base. L’option\u00a0“Export DPI”<\/b>\u00a0pr\u00e9sente dans le ruban permet de g\u00e9n\u00e9rer les fichiers correspondants. Le nom de ces images est format\u00e9 de la fa\u00e7on suivante\u00a0:<\/p>\n

                          \n
                          \n
                          omImage@dpi99x.Extension<\/div>\n<\/div>\n<\/div>\n

                          O\u00f9 99x correspond au coefficient multiplicateur par rapport au DPI de l’\u00e9diteur.
                          \nL’\u00e9diteur travaille en 160 DPI. Par exemple, pour une image “Logo.png”, le jeu d’images sera\u00a0:<\/p>\n

                            \n
                          • “Logo@dpi1x.png” pour le DPI de 160.<\/li>\n
                          • “Logo@dpi1_5x.png” pour le DPI de 240.<\/li>\n
                          • “Logo@dpi2x.png” pour le DPI de 320.<\/li>\n
                          • “Logo@dpi3x.png” pour le DPI de 480.<\/li>\n
                          • “Logo@dpi4x.png” pour le DPI de 640.<\/li>\n<\/ul>\n<\/div>\n<\/li>\n
                          • Cadre<\/b>\u00a0: Permet d’ajouter un cadre autour de l’image. Il est possible\u00a0:\n
                              \n
                            • d’utiliser un cadre pr\u00e9d\u00e9fini\u00a0: simple noir, rond (Android), …<\/li>\n
                            • de personnaliser un cadre pr\u00e9d\u00e9fini.<\/li>\n
                            • d’utiliser un cadre compl\u00e8tement personnalis\u00e9.<\/li>\n<\/ul>\n<\/li>\n
                            • 5 \u00e9tats<\/b>\u00a0: Permet de g\u00e9n\u00e9rer (ou de reg\u00e9n\u00e9rer) automatiquement une image \u00e0 5 \u00e9tats \u00e0 partir d’une image simple. L’image voit sa taille multipli\u00e9e par 5 en largeur. Les 5 \u00e9tats correspondent \u00e0\u00a0: Normal, Enfonc\u00e9, Gris\u00e9, S\u00e9lectionn\u00e9, Survol.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

                              Effets et r\u00e9glages<\/p>\n

                              \n
                              \n
                              \n
                              \n

                              L’\u00e9diteur d’images permet d’effectuer de nombreux r\u00e9glages sur l’image en cours via les options du groupe “Effets et r\u00e9glages”\u00a0:<\/p>\n

                              \"Effets<\/div>\n
                                \n
                              • Contraste Luminosit\u00e9<\/b>\u00a0: Permet de r\u00e9gler le niveau de contraste et le niveau de luminosit\u00e9 de l’image. Le contraste est compris entre -100 et +100. La luminosit\u00e9 est comprise entre -255 et +255. Ces r\u00e9glages peuvent \u00eatre visualis\u00e9s en temps r\u00e9el sur l’image (option “Aper\u00e7u sur l’image”).<\/span><\/li>\n
                              • Couleur transparente<\/b>\u00a0: Permet de s\u00e9lectionner la couleur qui deviendra transparente dans l’image. Ce r\u00e9glage peut \u00eatre visualis\u00e9 en temps r\u00e9el sur l’image (option “Aper\u00e7u sur l’image”). La pipette permet de s\u00e9lectionner directement une couleur de votre image.<\/li>\n
                              • R\u00e9glages TSL<\/b>\u00a0: Permet de modifier les options de Teinte, Saturation, Luminosit\u00e9 de l’image. La teinte est comprise entre -180 et +180. La saturation est comprise entre -100 et +100 . La luminosit\u00e9 est comprise entre -255 et +255. Ces r\u00e9glages peuvent \u00eatre visualis\u00e9s en temps r\u00e9el sur l’image (option “Aper\u00e7u sur l’image”).<\/li>\n
                              • Transformation de couleurs<\/b>\u00a0: Permet de remplacer dans l’image une couleur par une autre. Ce r\u00e9glage peut \u00eatre visualis\u00e9 en temps r\u00e9el sur l’image (option “Aper\u00e7u sur l’image”).<\/li>\n
                              • Ombre<\/b>\u00a0: Permet d’appliquer un effet d’ombre sur les \u00e9l\u00e9ments de l’image par rapport au fond de celle-ci. Les effets d’ombre sont cumulatifs \u00e0 chaque clic sur l’option “Ombre”. La source de lumi\u00e8re pour g\u00e9n\u00e9rer l’ombre provient du coin en haut \u00e0 gauche.<\/li>\n
                              • Halo<\/b>\u00a0: Permet de d\u00e9finir une ombre qui entoure les \u00e9l\u00e9ments de l’image (\u00e9quivalent d’une ombre de tous les c\u00f4t\u00e9s). L’\u00e9paisseur du halo peut \u00eatre r\u00e9gl\u00e9. Ce r\u00e9glage peut \u00eatre visualis\u00e9 en temps r\u00e9el sur l’image (option “Aper\u00e7u sur l’image”).<\/li>\n
                              • Noir et blanc<\/b>\u00a0: Permet de convertir l’image en couleurs en mode noir et blanc (niveaux de gris).<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

                                Calques<\/p>\n

                                \n
                                \n
                                \n
                                \n

                                L’\u00e9diteur d’images permet de g\u00e9rer des calques, c’est-\u00e0-dire des couches diff\u00e9rentes sur l’image.<\/p>\n

                                Ces calques peuvent \u00eatre g\u00e9r\u00e9s\u00a0:<\/div>\n
                                  \n
                                • via le ruban.<\/li>\n
                                • via le volet “Images”.<\/li>\n<\/ul>\n
                                  \n

                                  Dans le ruban, les options sont les suivantes\u00a0:<\/p>\n

                                  \"Calques\"<\/div>\n<\/div>\n
                                    \n
                                  • Nouveau calque\u00a0: Permet de cr\u00e9er un calque sur l’image. Ce calque peut \u00eatre cr\u00e9\u00e9\u00a0:\n
                                      \n
                                    • vierge,<\/li>\n
                                    • \u00e0 partir d’une image charg\u00e9e depuis un r\u00e9pertoire,<\/li>\n
                                    • \u00e0 partir d’une image charg\u00e9e depuis le catalogue d’images.<\/li>\n<\/ul>\n

                                      Le calque cr\u00e9\u00e9 peut \u00eatre manipul\u00e9 dans le volet “Images”, dans la zone “Calques”.<\/li>\n

                                    • Dupliquer\u00a0: Duplique le ou les calques s\u00e9lectionn\u00e9s dans le volet “Images”, zone “Calques”.<\/li>\n
                                    • Aplatir\u00a0: Fusionne tous les calques s\u00e9lectionn\u00e9s. Il est possible de s\u00e9lectionner une liste de calques pour la fusion en utilisant la multi-s\u00e9lection dans la liste des calques. Si un des calques s\u00e9lectionn\u00e9s n’est pas visible (symbole oeil gris\u00e9), un message d’erreur est affich\u00e9 indiquant qu’il n’est pas possible de fusionner des calques non visibles.<\/li>\n<\/ul>\n
                                      \n

                                      Dans la zone “Calques” du volet “Images”, il est possible de r\u00e9aliser les manipulations suivantes\u00a0:<\/p>\n

                                      \"Calques\"<\/div>\n
                                        \n
                                      • Rendre un calque visible ou invisible (\"Visible\"),<\/li>\n
                                      • Ajouter un nouveau calque (\"Nouveau\"),<\/li>\n
                                      • Supprimer le calque s\u00e9lectionn\u00e9 (\"Supprimer\"),<\/li>\n
                                      • Dupliquer le calque s\u00e9lectionn\u00e9 (\"Dupliquer\"),<\/li>\n
                                      • D\u00e9placer le calque s\u00e9lectionn\u00e9 (\"D\u00e9placer\"),<\/li>\n
                                      • Aplatir l’image (\"Aplatir\").<\/li>\n<\/ul>\n<\/div>\n
                                        Chaque calque poss\u00e8de \u00e9galement un menu contextuel de le manipuler (dupliquer, fusionner, d\u00e9placer, …).<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

                                        [\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"

                                        [vc_row][vc_column][vc_column_text]Un \u00e9diteur d’image\u00a0est accessible nativement dans l’application OTO Nom-i permettant aux utilisateurs de mieux concevoir les pamphlets et les catalogues de vos produits.\u00a0Cet \u00e9diteur propose de nombreuses fonctionnalit\u00e9s professionnels tel l’utilisation des calques, la transparence, les tons de couleurs et bien plus.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text] Les principales fonctionnalit\u00e9s de l’\u00e9diteur sont accessibles via le ruban “Image”. Fonctionnalit\u00e9s g\u00e9n\u00e9rales …<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[46],"tags":[],"_links":{"self":[{"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/posts\/2678"}],"collection":[{"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/comments?post=2678"}],"version-history":[{"count":2,"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/posts\/2678\/revisions"}],"predecessor-version":[{"id":2680,"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/posts\/2678\/revisions\/2680"}],"wp:attachment":[{"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/media?parent=2678"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/categories?post=2678"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.softbec.ca\/aide\/wp-json\/wp\/v2\/tags?post=2678"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}