{"id":129141,"date":"2018-03-19T14:03:15","date_gmt":"2018-03-19T13:03:15","guid":{"rendered":"https:\/\/www.justinmind.com\/blog\/the-user-interface-module\/"},"modified":"2025-02-13T17:11:58","modified_gmt":"2025-02-13T16:11:58","slug":"the-user-interface-module","status":"publish","type":"post","link":"https:\/\/www.justinmind.com\/de\/hilfe\/der-benutzer-schnittstelle-modul","title":{"rendered":"Das Modul Benutzeroberfl\u00e4che"},"content":{"rendered":"<p>Lernen Sie das Modul Benutzeroberfl\u00e4che kennen, in dem Sie die visuellen und interaktiven Komponenten von Prototypen erstellen werden.<\/p>\n<h2><a id=\"toolbar\"><\/a>Symbolleiste<\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-67970\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2022\/02\/user-interface-face-module.png\" alt=\"justinmind-user-interface-face-module\" width=\"1500\" height=\"861\"><br \/>\nDie Symbolleiste enth\u00e4lt Schnellbearbeitungsoptionen f\u00fcr das ausgew\u00e4hlte UI-Element des Bildschirms. In der Symbolleiste finden Sie die g\u00e4ngigsten und am h\u00e4ufigsten verwendeten Werkzeuge und Befehle. <img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-67971\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2022\/02\/justinmind-module-toolbar.png\" alt=\"justinmind-modul-werkzeugleiste\" width=\"1500\" height=\"139\"><\/p>\n<ol class=\"image-bullet\">\n<li><strong>Home<\/strong> &#8211; Klicken Sie darauf, um zu Ihrem Home-Dashboard zur\u00fcckzukehren.<\/li>\n<li><strong>Auswahl-Tools:<\/strong>\n<ul>\n<li><strong>Auswahlwerkzeug:<\/strong> Verwenden Sie dieses Werkzeug, um Elemente im Canvas auszuw\u00e4hlen. Mit einem Doppelklick w\u00e4hlen Sie innerhalb von Gruppen oder Containern aus. <\/li>\n<li><strong>Direktauswahl-Werkzeug:<\/strong> Ein Auswahlwerkzeug, das Gruppen und Container ignoriert, so dass Sie Elemente direkt ausw\u00e4hlen k\u00f6nnen.<\/li>\n<li><strong>Werkzeug L\u00f6schen:<\/strong> Dieses Werkzeug l\u00f6scht jedes Element, auf das Sie damit klicken.<\/li>\n<li><strong>Werkzeug Stil kopieren:<\/strong> Mit diesem Werkzeug k\u00f6nnen Sie alle Stileigenschaften wie Farben, Rahmen usw. von einem Element auf ein anderes kopieren. Klicken Sie zuerst auf das Element mit den Stilen, die Sie kopieren m\u00f6chten, und dann auf das Element, auf das Sie diese Stile anwenden m\u00f6chten. <\/li>\n<li><strong>Werkzeug zum Kopieren von Ereignissen:<\/strong> Mit diesem Werkzeug k\u00f6nnen Sie alle Ereignisse von einem Element auf ein anderes kopieren. Klicken Sie zuerst auf das Element mit den Ereignissen, die Sie kopieren m\u00f6chten, und dann auf das Element, auf das Sie diese Stile anwenden m\u00f6chten. <\/li>\n<li><strong>Zuschneiden-Werkzeug:<\/strong> W\u00e4hlen Sie ein Bild aus, und nachdem Sie dieses Werkzeug ausgew\u00e4hlt haben, k\u00f6nnen Sie es zuschneiden \/ eine Maske hinzuf\u00fcgen.<\/li>\n<\/ul>\n<\/li>\n<li><span style=\"font-weight: 400;\"><b>Stift-Werkzeug (Tastaturk\u00fcrzel P): <\/b>Nachdem Sie dieses Werkzeug ausgew\u00e4hlt haben, klicken Sie auf die Leinwand, um einen Ankerpunkt zu erstellen. Klicken Sie erneut, um eine Linie zu erstellen, oder klicken und ziehen Sie, um eine Kurve zu erstellen. Klicken Sie weiter, um eine Form zu erstellen.  <\/span><\/li>\n<li><b>Neues Rechteck (Tastaturk\u00fcrzel R):<\/b><span style=\"font-weight: 400;\">  Nachdem Sie dieses Werkzeug ausgew\u00e4hlt haben, klicken und ziehen Sie auf der Leinwand, um ein neues Rechteck zu erstellen. Halten Sie die &#8218;Shift&#8216;-Taste gedr\u00fcckt, um ein Quadrat zu erstellen. <\/span><\/li>\n<li><b>Neue Ellipse (E):<\/b><span style=\"font-weight: 400;\">  Nachdem Sie dieses Werkzeug ausgew\u00e4hlt haben, klicken und ziehen Sie auf der Leinwand, um eine neue Ellipse zu erstellen. Halten Sie die &#8218;Shift&#8216;-Taste gedr\u00fcckt, um einen Kreis zu erstellen. <\/span><\/li>\n<li><b>Neue Linie (L):<\/b><span style=\"font-weight: 400;\">  Nachdem Sie dieses Werkzeug ausgew\u00e4hlt haben, klicken und ziehen Sie auf der Leinwand, um eine neue Ellipse zu erstellen. Halten Sie die &#8218;Shift&#8216;-Taste gedr\u00fcckt, um den Winkel der Linie zu begrenzen. <\/span><\/li>\n<li><b>Neuer Text (T):<\/b><span style=\"font-weight: 400;\">  nachdem Sie dieses Werkzeug ausgew\u00e4hlt haben, klicken und ziehen Sie in die Arbeitsfl\u00e4che, um einen neuen Text zu erstellen. Das Textelement wird aktiviert und Sie k\u00f6nnen sofort mit der Eingabe beginnen. <\/span><\/li>\n<li><b>Neues Bild (I):<\/b><span style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">  Wenn Sie auf dieses Werkzeug klicken, wird ein Datei-Explorer zur Auswahl einer Bilddatei angezeigt. Nachdem Sie eine Datei ausgew\u00e4hlt haben, k\u00f6nnen Sie w\u00e4hlen, wo sie im Canvas platziert werden soll. Justinmind hilft den meisten Bildformaten und sogar SVG-Dateien.    <\/span><\/span>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">  W\u00e4hlen Sie das Element Bild auf dem Canvas aus und gehen Sie zum Hauptmen\u00fcpunkt &#8222;Bearbeiten&#8220;. W\u00e4hlen Sie &#8222;Bild&#8220; und dann &#8222;Datei ausw\u00e4hlen&#8230;&#8220; aus dem Kontextmen\u00fc und w\u00e4hlen Sie eine Bilddatei aus. <\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">W\u00e4hlen Sie das Element Bild, klicken Sie auf die Vorschau des Bildes in der Palette Eigenschaften und w\u00e4hlen Sie eine Bilddatei.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Ziehen Sie eine Bilddatei direkt aus Ihrem Dateisystem auf die Leinwand (es muss kein Bild-Element auf der Leinwand vorhanden sein).<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">Nachdem Sie ein Bild auf der Leinwand platziert haben, werden Sie aufgefordert, eine der folgenden Optionen zu w\u00e4hlen:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Bild in Prototyp einbinden &#8211; klicken Sie darauf, um das Bild in die Datei des Prototyps einzubetten.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Link zu einer Bilddatei &#8211; dies erstellt einen Link zu der Bilddatei, die Sie auf Ihrem Computer haben. Wenn Sie dieses Bild mit einem anderen Design-Tool bearbeiten, werden die Aktualisierungen automatisch auf den Prototyp angewendet. <\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Wenn Sie mit der rechten Maustaste auf ein Bild klicken, sehen Sie ein Bild-Untermen\u00fc mit zus\u00e4tzlichen Funktionen:<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Datei ausw\u00e4hlen&#8230; &#8211; \u00e4ndern Sie die Bilddatei des Bildelements.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Bilddatei bearbeiten&#8230; &#8211; \u00f6ffnet das Bild mit der Standardanwendung zur Bildbearbeitung. Wenn Sie etwas an diesem Bild \u00e4ndern und es speichern, werden die \u00c4nderungen automatisch auf das Bild im Prototyp angewendet. <\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Dateispeicherort \u00f6ffnen&#8230; &#8211; \u00f6ffnet den Ordner, der die Bilddatei enth\u00e4lt, wenn das Bild mit einer Datei verkn\u00fcpft ist.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Werkzeug Bild zuschneiden &#8211; aktiviert das Werkzeug Bild zuschneiden. Erm\u00f6glicht das Erstellen von Masken auf Bildern. <\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Horizontal spiegeln &#8211; kehrt das Bild \u00fcber die X-Achse um.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Vertikal spiegeln &#8211; kehrt das Bild \u00fcber die Y-Achse um.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Originalgr\u00f6\u00dfe einstellen &#8211; stellt das Bild in seiner urspr\u00fcnglichen Gr\u00f6\u00dfe wieder her.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">In Prototyp einbetten &#8211; bettet das Bild in den Prototyp ein, wenn das Bild mit einer Bilddatei verkn\u00fcpft wurde.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">L\u00f6schen &#8211; entfernt die angezeigte Bilddatei. Der Bildplatzhalter (der standardm\u00e4\u00dfig nach dem Platzieren eines Bild-Widgets auf der Leinwand erscheint) ersetzt die Bilddatei, bis Sie eine andere ausw\u00e4hlen. <\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Erstellen Sie eine separate Kopie &#8211; duplizieren Sie das Bild.<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">Bei der Arbeit mit Bildern gibt es einige Dinge zu beachten. Wenn Sie ein verlinktes Bild von einem Netzlaufwerk oder einem externen Ger\u00e4t haben und die Verbindung unterbrochen wird oder wenn Sie die Bilddatei aus Ihrem Dateisystem l\u00f6schen, kann Justinmind das Bild nicht aktualisieren und das Bild wird als letztes Update angezeigt. Ein Warnsymbol in der linken oberen Ecke des Bildes weist Sie auf einen defekten Link hin. Sobald die Verbindung wiederhergestellt ist oder das Bild in seinen urspr\u00fcnglichen Ordner zur\u00fcckgelegt wurde, verschwindet das Symbol und das Bild wird aktualisiert.Wenn ein Bild zu Justinmind hinzugef\u00fcgt wird, verliert es nicht an Qualit\u00e4t, auch nicht, wenn die Gr\u00f6\u00dfe ge\u00e4ndert wird. Retina-Bilder behalten die Retina-Qualit\u00e4t auf einem Retina-Display bei.    <\/span><\/li>\n<li><b><b>Weitere Tools:  <\/b><\/b>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Schaltfl\u00e4che (B):  <\/b><span style=\"font-weight: 400;\">Sie funktioniert wie ein einzelnes Element. Wenn Sie der Schaltfl\u00e4che ein Ereignis hinzuf\u00fcgen, wirkt sich dies auf die gesamte Komponente aus. Sowohl in den Ebenen als auch in den Eigenschaften erscheint sie in der Kategorie Schaltfl\u00e4che, so dass sie leicht von anderen Komponenten zu unterscheiden ist. Schaltfl\u00e4chen k\u00f6nnen Text enthalten und ihr Hintergrund und ihr Rahmen k\u00f6nnen ver\u00e4ndert werden.   <\/span><b>.<\/b><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Hotspot (H)<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\">  Nachdem Sie dieses Werkzeug ausgew\u00e4hlt haben, klicken Sie auf die Leinwand und ziehen Sie, um einen neuen Hotspot zu erstellen. Ein Hotspot ist eine Art transparentes Rechteck, mit dem Sie Ereignisse zu Bildbereichen hinzuf\u00fcgen k\u00f6nnen. <\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Tabelle<\/b><span style=\"font-weight: 400;\">: <\/span> <span style=\"font-weight: 400;\">Das Element Tabelle erstellt ein Gitter oder eine Tabelle, die beliebige andere Elemente wie Textfelder, Abs\u00e4tze und Bilder enthalten kann. Wenn Sie das Table-Element auf den Canvas ziehen, hat es standardm\u00e4\u00dfig zwei Zeilen und zwei Spalten, die jedoch in der Eigenschaftenpalette ge\u00e4ndert werden k\u00f6nnen. <\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Interaktive Eingabefelder<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\">  Eine Sammlung von Tools zur Erstellung verschiedener Arten von Eingabefeldern. Diese Eingabefelder sind von sich aus interaktiv, ohne dass Sie weitere Interaktionen hinzuf\u00fcgen m\u00fcssen.   <\/span><b>Eingabe Textfeld (F)<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\"> Textfeld, in das der Benutzer w\u00e4hrend der Simulation einen Wert eingeben kann.Eingabe-Textfelder k\u00f6nnen eine von sechs Textarten sein: Text, Textbereich, Passwort, Zahl, E-Mail und URL. <\/span><b>W\u00e4hlen Sie aus:<\/b> <span style=\"font-weight: 400;\">Sie k\u00f6nnen die Werte des Elements Auswahlliste in der Eigenschaften-Palette bearbeiten, indem Sie auf die Option &#8222;Werte bearbeiten&#8220; klicken. Um einen seiner Werte als Standard festzulegen, doppelklicken Sie auf den gew\u00fcnschten Wert innerhalb des Elements auf dem Canvas. Um einen seiner Werte w\u00e4hrend der Simulation auszuw\u00e4hlen, klicken Sie einfach einmal auf das Element und w\u00e4hlen einen Wert aus der Dropdown-Liste.    <\/span><b>Datum:<\/b><span style=\"font-weight: 400;\"> Erm\u00f6glicht es dem Benutzer, ein Datum und\/oder eine Uhrzeit in der Simulation auszuw\u00e4hlen. <\/span><b>Liste:<\/b><span style=\"font-weight: 400;\">  zeigt eine Liste von Werten an. Sie k\u00f6nnen die Werte des Elements Auswahlliste in der Palette Eigenschaften bearbeiten, indem Sie auf die Option &#8222;Werte bearbeiten&#8220; klicken. Um den ausgew\u00e4hlten Standardwert festzulegen, doppelklicken Sie auf den gew\u00fcnschten Wert innerhalb des Elements auf der Leinwand. Um w\u00e4hrend der Simulation einen Wert aus dem List Box Widget auszuw\u00e4hlen, klicken Sie auf den gew\u00fcnschten Wert innerhalb des Elements.     <\/span><b>Liste mit Mehrfachauswahl:<\/b> <span style=\"font-weight: 400;\">zeigt eine Liste von Werten an. Sie k\u00f6nnen die Werte dieses Elements in der Eigenschaften-Palette bearbeiten, indem Sie auf die Option &#8222;Werte bearbeiten&#8220; klicken. Um den\/die Standardwert(e) festzulegen, doppelklicken Sie auf den\/die gew\u00fcnschten Wert(e) innerhalb des Elements auf dem Canvas. Um einen Wert w\u00e4hrend der Simulation auszuw\u00e4hlen bzw. die Auswahl aufzuheben, klicken Sie einfach auf den\/die Wert(e). Denken Sie daran, dass Sie so viele Werte ausw\u00e4hlen k\u00f6nnen, wie Sie m\u00f6chten.      <\/span><b>Datei hochladen:<\/b><span style=\"font-weight: 400;\">  erm\u00f6glicht es dem Benutzer, eine Datei von seinem Computer auszuw\u00e4hlen. Sie wird durch ein Textfeld mit einer Schaltfl\u00e4che Durchsuchen auf der rechten Seite angezeigt. Mit dieser Eingabe wird die eigentliche Datei nicht auf den Server hochgeladen, sondern es wird lediglich der Dateibrowser angezeigt und der Name der Datei gespeichert, der in anderen Teilen der Simulation verwendet werden kann.    <\/span><b>Ankreuzen: <\/b><span style=\"font-weight: 400;\">Kontrollk\u00e4stchen sind anklickbare Schaltfl\u00e4chen, mit denen Sie mehr als eine Option ausw\u00e4hlen k\u00f6nnen. <\/span><b>Radio: <\/b> <span style=\"font-weight: 400;\">Die Optionsfelder sind anklickbare Schaltfl\u00e4chen. Wenn Sie eines ausw\u00e4hlen, werden die anderen abgew\u00e4hlt. Damit sie zusammen funktionieren, m\u00fcssen sie sich immer in einer Gruppe befinden. <\/span><b>Checkliste:<\/b> <span style=\"font-weight: 400;\">\u00c4hnlich wie die Optionsliste, aber mit Kontrollk\u00e4stchen anstelle von Optionsschaltfl\u00e4chen. <\/span><b>Radio-Liste:<\/b> <span style=\"font-weight: 400;\">eine Gruppe von Optionsfeldern. Es kann jeweils nur ein Wert ausgew\u00e4hlt werden. <\/span><\/li>\n<li><b>Linien und Formen:<\/b><span style=\"font-weight: 400;\"> Eine grundlegende Sammlung von Werkzeugen zum Zeichnen von Grundformen. <\/span><b>Rechteck (R)<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\">  Klicken und ziehen Sie, um ein Rechteck auf der Leinwand zu zeichnen. Halten Sie die Umschalttaste gedr\u00fcckt, um ein Quadrat zu zeichnen. Wenn Sie auf das Rechteck doppelklicken, k\u00f6nnen Sie Text in das Rechteck einf\u00fcgen.    <\/span><b>Ellipse (E)<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\">  Klicken und ziehen Sie, um eine Ellipse auf der Leinwand zu zeichnen. Halten Sie die Umschalttaste gedr\u00fcckt, um einen Kreis zu zeichnen. Wenn Sie auf den Kreis doppelklicken, k\u00f6nnen Sie Text in den Kreis einf\u00fcgen.    <\/span><b>Linie (L):<\/b><span style=\"font-weight: 400;\">  klicken Sie auf die Leinwand, um den Anfangspunkt der Linie zu definieren und dann ein zweites Mal, um das Ende der Linie zu definieren. Sie k\u00f6nnen alle Endpunkte \u00e4ndern, indem Sie sie ausw\u00e4hlen und auf der Leinwand ziehen. Sie k\u00f6nnen die Endpunkte auch in der Eigenschaften-Palette in Pfeilpunkte umwandeln.    <\/span><b>Dreieck:<\/b> <span style=\"font-weight: 400;\">klicken und ziehen Sie, um ein Dreieck auf der Leinwand zu zeichnen. Wenn Sie auf den Kreis doppelklicken, k\u00f6nnen Sie Text in den Kreis einf\u00fcgen.   <\/span><b>Pfeil<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\">  klicken Sie auf die Leinwand, um den Anfangspunkt des Pfeils zu definieren und dann ein zweites Mal, um das Ende des Pfeils zu definieren. Sie k\u00f6nnen alle Endpunkte \u00e4ndern, indem Sie sie markieren und auf der Leinwand ziehen. Sie k\u00f6nnen die Endpunkte auch in der Eigenschaftenpalette in Pfeilspitzen \u00e4ndern.    <\/span><b>Aufruf<\/b><span style=\"font-weight: 400;\">: <\/span> <span style=\"font-weight: 400;\">Klicken und ziehen Sie, um ein Callout auf der Leinwand zu zeichnen. Ein Doppelklick auf den Kreis erm\u00f6glicht es Ihnen, Text in den Kreis einzuf\u00fcgen. <\/span><\/li>\n<\/ul>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>Dynamische Inhalte:<\/b> <span style=\"font-weight: 400;\">Eine Sammlung von Tools f\u00fcr verschiedene Arten von dynamischen Elementen wie dynamische Panels oder Datengitter\/Listen. <\/span><b>Dynamisches Panel (D)<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\">  verwenden Sie dieses Tool, um dynamische Panels zu erstellen. Ein dynamisches Panel erm\u00f6glicht es, mithilfe von Ereignissen verschiedene Inhalte auf derselben Seite anzuzeigen.   <\/span><b>Daten Liste<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\">  verwenden Sie dieses Tool, um Datenlisten zu erstellen. Mit Datenlisten k\u00f6nnen Sie Tabellen anzeigen, deren Zeilen durch Ereignisse mit einer Logik verkn\u00fcpft werden k\u00f6nnen.   <\/span><b>Data Grid:<\/b><span style=\"font-weight: 400;\">  verwenden Sie dieses Tool, um Data Grids zu erstellen. Datenlisten sind eine M\u00f6glichkeit, Listen von Karten in einem Raster anzuzeigen, wobei der Inhalt der Karten durch Ereignisse mit einer Logik verkn\u00fcpft werden kann. <\/span><\/li>\n<li><b>Andere Elemente<\/b><span style=\"font-weight: 400;\">:<\/span><span style=\"font-weight: 400;\"> Eine Sammlung von Tools f\u00fcr verschiedene Arten von Elementen wie Tabellen und eingebettetes HTML. <\/span><b>Text-Tabelle:<\/b><span style=\"font-weight: 400;\">  nachdem Sie dieses Werkzeug ausgew\u00e4hlt haben, klicken Sie auf die Leinwand und ziehen Sie sie, um eine neue 3\u00d73 Texttabelle zu erstellen. Ein paar Dinge \u00fcber Texttabellen-Elemente.   <\/span><b>iFrame:<\/b><span style=\"font-weight: 400;\">  erstellt es einen Platzhalter f\u00fcr HTML-Code. Sie k\u00f6nnen einen beliebigen HTML-Code in das Bedienfeld Eigenschaften eingeben, der dann in dem von diesem Element definierten Bereich gerendert wird.   <\/span><b>Website:<\/b><span style=\"font-weight: 400;\">  erstellt es einen Platzhalter, auf dem eine ganze Website angezeigt werden kann. Die URL der Website, die angezeigt werden soll, wird in der Palette Eigenschaften definiert. Einige Websites haben erweiterte Sicherheitseigenschaften, die verhindern, dass sie auf diese Weise angezeigt werden k\u00f6nnen. <b>Dokument \/ Video:<\/b> Verwenden Sie dieses Element, um ein beliebiges Dokument in einem Bereich der Leinwand anzuzeigen. <b>HTML-Ordner:<\/b> Verwenden Sie dieses Element, um einen ganzen HTML-Ordner in Ihren Prototyp einzubetten.  <\/span><\/li>\n<\/ul>\n<\/li>\n<li><strong>Zoom-Optionen:<\/strong> eine Sammlung zus\u00e4tzlicher Optionen f\u00fcr den Zoom.<\/li>\n<li><strong>Ausrichtungswerkzeuge:<\/strong> eine Sammlung von Werkzeugen zum Ausrichten einer Auswahl mehrerer Elemente im Canvas oder eines einzelnen Elements relativ zum Canvas.<\/li>\n<li><strong>Auf Ger\u00e4t anzeigen:<\/strong> Klicken Sie auf diese Option, um den aktuellen Zustand des Prototyps auf einem mobilen Ger\u00e4t zu simulieren.<\/li>\n<li><strong>Simulieren:<\/strong> Klicken Sie auf diese Option, um die Simulation des aktuellen Prototyps zu starten.<\/li>\n<li><strong>Teilen:<\/strong> Laden Sie den aktuellen Stand des Prototyps in Ihr Online-Konto hoch, um die Simulation mit Gutachtern und Entwicklern zu teilen.<\/li>\n<li><strong>Erhalten Sie alle \u00c4nderungen:<\/strong> Aktualisieren Sie das Projekt mit allen \u00c4nderungen, die von den \u00fcbrigen Teammitgliedern vorgenommen wurden.<\/li>\n<\/ol>\n<h2><a id=\"the-user-interface-module\"><\/a>Module ausw\u00e4hlen<\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-14194\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/switch-between-modules-1.png\" alt=\"zwischen-module-schalten-1\" width=\"755\" height=\"430\"><br \/>\nMit dieser Dropdown-Liste k\u00f6nnen Sie zwischen den vier Modulen von Justinmind wechseln: Benutzeroberfl\u00e4che, Kommentare, Szenarien und Anforderungen. Jedes Modul kann Informationen \u00fcber verschiedene Aspekte der Anwendung enthalten, die Sie entwerfen. Die Benutzeroberfl\u00e4che dient zum Design der Bildschirme und Interaktionen des Prototyps. Kommentare speichert und verwaltet alle Gespr\u00e4che und R\u00fcckmeldungen, die Sie mit Ihren Interessengruppen f\u00fchren. Scenarios ist ein allgemeines Diagramm-Tool, mit dem Sie Benutzerabl\u00e4ufe oder Site Maps designen k\u00f6nnen. Und schlie\u00dflich ist Requirements ein komplettes Tool f\u00fcr das Anforderungsmanagement und der Punkt der Integration mit JIRA und Azure DevOps.     <\/p>\n<h2><a id=\"workspace\"><\/a>Der Arbeitsbereich<\/h2>\n<p>Hier finden Sie eine \u00dcbersicht \u00fcber die einzelnen Paletten im Modul Benutzeroberfl\u00e4che:<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-14196\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/user-interface-palette-overview-1.png\" alt=\"benutzer-oberfl\u00e4che-palette-\u00fcbersicht-1\" width=\"755\" height=\"430\"><\/p>\n<ol class=\"image-bullet\">\n<li><strong>Palette Bildschirme<\/strong> &#8211; die Palette Bildschirme listet alle Bildschirme des Prototyps auf.<\/li>\n<li><strong>Vorlagenpalette<\/strong> &#8211; die Vorlagenpalette listet alle im Prototyp enthaltenen Vorlagen auf. <a href=\"https:\/\/www.justinmind.com\/de\/hilfe\/templates-and-masters\" target=\"_blank\" rel=\"noopener noreferrer\">Erfahren Sie mehr \u00fcber das Prototyping mit Vorlagen.<\/a><\/li>\n<li><strong>Palette Widget-Bibliotheken<\/strong> &#8211; Die Palette Widgets enth\u00e4lt vorgefertigte Widgets, mit denen Sie den Inhalt eines Prototyps erstellen k\u00f6nnen. Ziehen Sie sie einfach per Drag &amp; Drop auf die Leinwand oder klicken Sie auf ein Widget und dann auf die Position im Canvas, an der Sie es platzieren m\u00f6chten. <\/li>\n<li><strong>Masters-Palette<\/strong> &#8211; die Masters-Palette listet alle im Prototyp enthaltenen Masters auf. <a href=\"https:\/\/www.justinmind.com\/de\/hilfe\/templates-and-masters\" target=\"_blank\" rel=\"noopener noreferrer\">Erfahren Sie mehr \u00fcber das Prototyping mit Masters.<\/a><\/li>\n<li><strong>Bildschirme auf dem Canvas<\/strong> &#8211; oben auf dem Canvas finden Sie Registerkarten f\u00fcr jeden Bildschirm innerhalb des Prototyps. Diese sind n\u00fctzlich, um schnell zwischen den Bildschirmen zu wechseln. Die ausgew\u00e4hlte Registerkarte ist auf dem Canvas aktiv.  <\/li>\n<li><strong>Canvas<\/strong> &#8211; designen Sie die Bildschirme, Vorlagen und Master des Prototyps, indem Sie Widgets auf die Canvas ziehen. Es zeigt den aktiven Bildschirm, die Vorlage oder den Master an. <\/li>\n<li><strong>Eigenschaften-Palette<\/strong> &#8211; bearbeiten Sie die Eigenschaften des ausgew\u00e4hlten UI-Elements (z.B. Name, Farbe, Rahmen, Schriftart, Position) in der Eigenschaften-Palette.<\/li>\n<li><strong>Ereignispalette<\/strong> &#8211; f\u00fcgen Sie UI-Elementen und Bildschirmen Funktionalit\u00e4t hinzu. <a href=\"https:\/\/www.justinmind.com\/de\/support\/events-and-interactions\" target=\"_blank\" rel=\"noopener noreferrer\">Erfahren Sie mehr \u00fcber die Erstellung von Ereignissen in Justinmind Prototypen.<\/a><\/li>\n<li><strong>CSS-Palette<\/strong> &#8211; Kopieren Sie die Stile von UI-Elementen (Standard- oder benutzerdefinierte Stile), einschlie\u00dflich Breite, H\u00f6he, Schriftfamilie, Gr\u00f6\u00dfe, Gewicht und Farbe, in andere Design-Tools oder Programme in der CSS-Palette. Sie k\u00f6nnen keine Inhalte aus der CSS-Palette heraus \u00e4ndern. Um Eigenschaften zu bearbeiten, gehen Sie erneut auf die Palette Eigenschaften (7).  <\/li>\n<li><strong>Ebenen-Palette<\/strong> &#8211; die Umriss-Palette zeigt alle UI-Elemente des ausgew\u00e4hlten Bildschirms an.<\/li>\n<li><strong>Data Masters-Palette<\/strong> &#8211; hier finden Sie eine Liste der Data Masters eines Prototyps. <a href=\"https:\/\/www.justinmind.com\/de\/hilfe\/prototyping-forms-data-lists-and-data-grids\" target=\"_blank\" rel=\"noopener noreferrer\">Erfahren Sie mehr \u00fcber die Arbeit mit Data Masters und datengesteuertes Prototyping.<\/a><\/li>\n<li><strong>Variablen-Palette<\/strong> &#8211; hier finden Sie eine Liste der Variablen eines Prototyps. <a href=\"https:\/\/www.justinmind.com\/de\/support\/variables\" target=\"_blank\" rel=\"noopener noreferrer\">Erfahren Sie mehr \u00fcber die Arbeit mit Variablen.<\/a><\/li>\n<li><strong>Anforderungspalette<\/strong> &#8211; Anzeigen und Hinzuf\u00fcgen von Anforderungen in einem Prototyp. <a href=\"https:\/\/www.justinmind.com\/de\/support\/the-requirements-module\" rel=\"noopener\">Erfahren Sie mehr \u00fcber die Arbeit mit Anforderungen.<\/a><\/li>\n<li><strong>Kommentarpalette<\/strong> &#8211; Anzeigen und Hinzuf\u00fcgen von Kommentaren in einem Prototyp. <a href=\"https:\/\/www.justinmind.com\/de\/hilfe\/die-kommentare-modul\" rel=\"noopener\">Erfahren Sie mehr \u00fcber Kommentare in Justinmind.<\/a><\/li>\n<\/ol>\n<h2><a id=\"customizing-the-workspace\"><\/a>Anpassen des Arbeitsbereichs<\/h2>\n<p>Sie k\u00f6nnen den Arbeitsbereich anpassen, indem Sie Paletten ein- und ausblenden, verschieben und neu positionieren. Sie k\u00f6nnen Paletten innerhalb einer Gruppe von Paletten neu anordnen, eine Palette in eine andere Gruppe verschieben oder sie einfach schweben lassen, indem Sie sie an eine beliebige Stelle auf dem Bildschirm ziehen, die keine Paletten enth\u00e4lt. <\/p>\n<div class=\"embed-container\" style=\"padding-bottom: 54%;\"><iframe loading=\"lazy\" src=\"https:\/\/player.vimeo.com\/video\/762220285\" width=\"640\" height=\"564\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n<p>Alle \u00c4nderungen im Arbeitsbereich bleiben erhalten, wenn Sie Justinmind das n\u00e4chste Mal \u00f6ffnen. Um den Arbeitsbereich zur\u00fcckzusetzen, w\u00e4hlen Sie die Option &#8222;Arbeitsbereich zur\u00fccksetzen&#8220; aus dem Hauptmen\u00fc &#8222;Paletten&#8220;. <\/p>\n<h2><a id=\"the-screens-palette\"><\/a>Die Palette Bildschirme<\/h2>\n<p>Die Palette Bildschirme listet alle Bildschirme eines Prototyps auf.<\/p>\n<p>In der Palette Bildschirme k\u00f6nnen Sie Bildschirme hinzuf\u00fcgen, l\u00f6schen und verwalten.<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13228\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/screens-palette.png\" alt=\"Bildschirmpalette\" width=\"755\" height=\"293\"><\/p>\n<ol class=\"image-bullet\">\n<li>F\u00fcgen Sie dem Prototyp einen neuen Bildschirm hinzu<\/li>\n<li>Einen neuen Bildschirm aus einer Bilddatei hinzuf\u00fcgen<\/li>\n<li>Erstellen Sie einen Ordner, um Ihre Bildschirme zu organisieren<\/li>\n<li>Anzeigen der Bildschirme als Liste von Namen<\/li>\n<li>Anzeigen der Bildschirme als Liste von Bildschirmfotos<\/li>\n<li>Bildschirm in der Bildschirmhierarchie eine Position nach unten verschieben<\/li>\n<li>Bildschirm in der Bildschirmhierarchie eine Position nach oben verschieben<\/li>\n<\/ol>\n<p>Klicken Sie mit der rechten Maustaste auf einen Bildschirm, um die Optionen f\u00fcr einen einzelnen Bildschirm zu verwalten:<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-14199\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/manage-screens-options-2.png\" alt=\"Bildschirme verwalten-Optionen-2\" width=\"755\" height=\"475\"><\/p>\n<ol class=\"image-bullet\">\n<li>Bearbeiten Sie einige Eigenschaften des Bildschirms, z. B. den Namen oder die Vorlage. Weitere Optionen finden Sie in der Palette Eigenschaften. <\/li>\n<li>Legen Sie den aktuellen Bildschirm als Startbildschirm des Prototyps fest. Dieser wird als Ausgangspunkt f\u00fcr die gemeinsamen Simulationen und f\u00fcr die Berechnung der verbundenen Bildschirme verwendet. <\/li>\n<li>Duplizieren Sie den ausgew\u00e4hlten Bildschirm.<\/li>\n<li>L\u00f6schen Sie den ausgew\u00e4hlten Bildschirm.<\/li>\n<li>Kategorisieren Sie den Bildschirm. W\u00e4hlen Sie eine der folgenden M\u00f6glichkeiten: Erledigt, Zu \u00e4ndern, Verworfen, Keine. <\/li>\n<li>Erstellen Sie einen Kommentar, der mit dem gesamten Bildschirm verkn\u00fcpft ist.<\/li>\n<li>Erstellen Sie eine Anforderung, die mit dem gesamten Bildschirm verkn\u00fcpft ist.<\/li>\n<li>Erstellen Sie eine Bilddatei (PNG) mit dem Inhalt des Bildschirms.<\/li>\n<\/ol>\n<p>Auf dem Bildschirm wird eines von drei Symbolen angezeigt:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-40835\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/ScreenIcons-1.png\" alt=\"Beschreibungen der Bildschirmsymbole\" width=\"2048\" height=\"929\"><\/p>\n<ol class=\"image-bullet\">\n<li>Startbildschirm oder Home-Bildschirm. Dies ist der erste Bildschirm des Prototyps, der bei der Anzeige eines freigegebenen Prototyps oder auf einem Ger\u00e4t geladen wird. <\/li>\n<li>Mit dem Startbildschirm verkn\u00fcpfte Bildschirme.<\/li>\n<\/ol>\n<h2><a id=\"the-widget-library-palette\"><\/a>Die Palette der Widget-Bibliothek<\/h2>\n<p>Die Palette Bibliotheken erm\u00f6glicht das Hinzuf\u00fcgen und Erstellen benutzerdefinierter Sammlungen von Elementen, die im aktuellen Prototyp oder in einem anderen Prototyp verwendet werden k\u00f6nnen.<\/p>\n<p>Um Ihre Widget-Bibliotheken hinzuzuf\u00fcgen und zu verwalten, gehen Sie zur Palette Bibliotheken. Klicken Sie in der linken oberen Ecke auf den Text &#8218;Weitere Bibliotheken&#8216;, um zum Dialog &#8222;Bibliotheken konfigurieren&#8220; zu gelangen. Dieses Dialogfeld enth\u00e4lt alle Ihre verf\u00fcgbaren Bibliotheken, einschlie\u00dflich der von Ihnen erstellten Bibliotheken. Von diesem Dialog aus k\u00f6nnen Sie dem Editor von Justinmind Widget-Bibliotheken hinzuf\u00fcgen und Widget-Bibliotheken aus ihm entfernen.<br \/>\n<a href=\"https:\/\/www.justinmind.com\/de\/hilfe\/ui-widget-bibliotheken\" target=\"_blank\" rel=\"noopener noreferrer\">Erfahren Sie mehr \u00fcber die Verwaltung Ihrer Widget-Bibliotheken.<\/a><\/p>\n<p>Mit dem Pluszeichen auf der Palette k\u00f6nnen Sie eine neue Bibliothek erstellen. Bitte lesen Sie die entsprechenden Abschnitte im Benutzerhandbuch, um zu erfahren, wie Sie Ihre eigenen Widget-Bibliotheken erstellen k\u00f6nnen. In derselben Palette k\u00f6nnen Sie nach bestimmten Widgets suchen und die Art und Weise konfigurieren, wie die Liste der Widgets in der Palette angezeigt wird.  <\/p>\n<h2><a id=\"the-canvas\"><\/a>Die Leinwand<\/h2>\n<p>Entwerfen Sie die Bildschirme, Vorlagen und Master Ihres Prototyps, indem Sie Elemente auf dem Canvas hinzuf\u00fcgen. Sie zeigt den aktiven Bildschirm, die Vorlage oder den Master an.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-67972\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2022\/02\/justinmind-user-interface.png\" alt=\"justinmind-user-interface\" width=\"1500\" height=\"861\"><br \/>\nZoomen Sie in den Canvas hinein und aus ihm heraus, indem Sie die Zoomstufe in der Symbolleiste von Justinmind eingeben, die Tastenkombinationen STRG + (CMD + bei Mac) und &#8211; verwenden oder auf das Trackpad dr\u00fccken. Sie k\u00f6nnen auch die Optionen neben der Zoom-Anzeige in der Symbolleiste verwenden, z.B. das Zoom-Werkzeug oder verschiedene vordefinierte Zoom-Stufen. <\/p>\n<p>Passen Sie das Design des Prototyps pixelgenau an und ordnen Sie die Widgets mit den folgenden Ansichtsoptionen an und richten Sie sie aus. Jede kann im Men\u00fc Ansicht aktiviert\/deaktiviert werden: <\/p>\n<ul>\n<li><strong>Lineale:<\/strong> Damit k\u00f6nnen Sie Hilfslinien erstellen, die Sie zum Ausrichten von Elementen im Canvas verwenden k\u00f6nnen. Sie k\u00f6nnen Hilfslinien erstellen oder l\u00f6schen, indem Sie mit der rechten Maustaste auf die Lineale klicken. <\/li>\n<li><strong>Hilfslinien:<\/strong> Linien, die von Seite zu Seite und von oben nach unten verlaufen und zum Ausrichten von Elementen im Canvas verwendet werden. Um eine Hilfslinie zu erstellen, klicken Sie mit der rechten Maustaste auf eine beliebige Stelle innerhalb der horizontalen oder vertikalen Lineale und w\u00e4hlen Sie Hilfslinie erstellen. Sie k\u00f6nnen die Hilfslinie dann an die gew\u00fcnschte Position auf dem Canvas ziehen. Um eine Hilfslinie zu l\u00f6schen, klicken Sie mit der rechten Maustaste auf sie und w\u00e4hlen Sie &#8222;Hilfslinie entfernen&#8220;.<br \/>\nDie in einem Bildschirm erstellten Hilfslinien geh\u00f6ren zu diesem Bildschirm, aber die auf einer Vorlage erstellten Hilfslinien werden in allen Bildschirmen angezeigt, die diese Vorlage verwenden.<\/li>\n<li><strong>Raster:<\/strong> ein Raster zum Ausrichten von Elementen auf dem Canvas. Wenn das Raster aktiviert ist, wird eine Reihe von vertikalen und horizontalen Punkten auf dem Canvas-Hintergrund angezeigt. Das Raster wird w\u00e4hrend der Simulation nicht angezeigt. W\u00e4hlen Sie die Option &#8222;Am Raster ausrichten&#8220; aus der Option &#8222;Ansicht&#8220; im Hauptmen\u00fc, damit sich UI-Elemente automatisch an der n\u00e4chstgelegenen Rasterlinie ausrichten.   <\/li>\n<li><strong>An Geometrie einrasten:<\/strong> Richten Sie Elemente im Verh\u00e4ltnis zu den umliegenden Elementen ein. Diese gr\u00fcnen Markierungen erscheinen, wenn Sie den Mauszeiger \u00fcber ein UI-Element bewegen oder ein Element vertikal\/horizontal ziehen. Blaue vertikale\/horizontale Linien erscheinen an den R\u00e4ndern der benachbarten Elemente. Halten Sie beim Ziehen des Widgets die &#8222;Alt&#8220;-Taste gedr\u00fcckt, um ein Einrasten zu vermeiden.   <\/li>\n<li><strong>Intelligente Hilfslinien:<\/strong> Hilfslinien, die die Gr\u00f6\u00dfe und Positionierung eines Elements auf dem Canvas im Verh\u00e4ltnis zu den umgebenden Elementen anzeigen.<\/li>\n<\/ul>\n<h2><a id=\"the-properties-palette\"><\/a>Die Palette Eigenschaften<\/h2>\n<p>Die Palette Eigenschaften bietet alle notwendigen Werkzeuge, um eine Stileigenschaft f\u00fcr das ausgew\u00e4hlte Element zu \u00e4ndern, sowie einige spezifische Konfigurationseigenschaften f\u00fcr dieses Element.<\/p>\n<p>Der obere Bereich der Palette zeigt die Art des Elements an, das gerade ausgew\u00e4hlt ist. Daneben gibt es zwei Symbole, mit denen Sie zwei Eigenschaften konfigurieren k\u00f6nnen: Ausgeblendet und Immer im Vordergrund. Das Symbol &#8218;Ausgeblendet&#8216; legt fest, ob das ausgew\u00e4hlte Element beim Start der Simulation sichtbar sein soll oder nicht. Das Symbol &#8218;Immer oben&#8216; legt fest, ob das ausgew\u00e4hlte Element immer \u00fcber den anderen Elementen in der Simulation angezeigt werden soll.   <\/p>\n<p>Hier finden Sie einen \u00dcberblick \u00fcber die einzelnen Unterabschnitte der Palette Eigenschaften. Um mit der Bearbeitung eines UI-Elements zu beginnen, w\u00e4hlen Sie es auf dem Canvas aus und gehen Sie zur Palette Eigenschaften. <\/p>\n<div><strong>Hinweis:<\/strong> Die Eigenschaften k\u00f6nnen je nach ausgew\u00e4hltem UI-Element variieren.<\/div>\n<h4>Position<\/h4>\n<ul>\n<li><strong>X\/Y:<\/strong> Definieren Sie die X- und\/oder Y-Position des Elements auf dem Canvas mit den mitgelieferten Spinnern. Sie k\u00f6nnen bei Bedarf Dezimalstellen eines Pixels verwenden. <\/li>\n<li><strong>Pin-Symbol:<\/strong> Aktivieren Sie diese Option, um zus\u00e4tzliche Positionierungsoptionen f\u00fcr das Design von responsiven Prototypen anzuzeigen. Mehr dazu erfahren Sie im Abschnitt &#8222;Optionen f\u00fcr die Pin-Position&#8220; weiter unten. <\/li>\n<\/ul>\n<h4>Optionen f\u00fcr die Stiftposition:<\/h4>\n<p>Wenn das Symbol f\u00fcr die Pin-Position aktiviert ist, werden neben den Eingabefeldern f\u00fcr die X- und Y-Position zwei Dropdowns angezeigt. Mit jedem Dropdown-Men\u00fc k\u00f6nnen Sie die verschiedenen Pin-Optionen f\u00fcr jede Koordinate unabh\u00e4ngig voneinander festlegen. <\/p>\n<h4>Gr\u00f6\u00dfe<\/h4>\n<ul>\n<li><strong>Breite:<\/strong> Definieren Sie die Breite des Elements. Neben der Eingabe befindet sich ein Dropdown-Men\u00fc, mit dem Sie ausw\u00e4hlen k\u00f6nnen, ob die Breite als Anzahl von Pixeln oder als Prozentsatz der Breite des Containers, in dem sich das Element befindet, definiert wird. <\/li>\n<li><strong>H\u00f6he:<\/strong> Definieren Sie die H\u00f6he des Elements. Neben der Eingabe befindet sich ein Dropdown-Men\u00fc, mit dem Sie ausw\u00e4hlen k\u00f6nnen, ob die H\u00f6he als Anzahl von Pixeln oder als Prozentsatz der Breite des Containers, in dem sich das Element befindet, definiert wird. <\/li>\n<li><strong>Symbol Proportionen beibehalten:<\/strong> Klicken Sie auf dieses Symbol, um zu erzwingen, dass bei jeder \u00c4nderung der H\u00f6he oder Breite die aktuellen Proportionen beibehalten werden.<\/li>\n<\/ul>\n<h4>Text<\/h4>\n<p>Text UI-Elemente haben die folgenden Texteigenschaften:<\/p>\n<ul>\n<li><strong>Schriftart:<\/strong> W\u00e4hlen Sie eine Schriftart aus der Dropdown-Liste. Es werden die Schriften geladen, die auf Ihrem Computer installiert sind. <\/li>\n<li><strong>Schriftart:<\/strong> W\u00e4hlen Sie die Schriftart aus der Dropdown-Liste. Die verf\u00fcgbaren Stile sind die, die durch die Schriftart definiert sind. <\/li>\n<li><strong>Gr\u00f6\u00dfe:<\/strong> W\u00e4hlen Sie eine Schriftgr\u00f6\u00dfe (in Punkt) aus der Dropdown-Liste<\/li>\n<li><strong>Farbe:<\/strong> &#8211; \u00c4ndern Sie die Schriftfarbe aus der Dropdown-Liste<\/li>\n<li><strong>Symbole f\u00fcr Unterstreichen und Durchstreichen:<\/strong> zus\u00e4tzliche Dekorationsoptionen f\u00fcr den Text.<\/li>\n<li><strong>Horizontale Ausrichtung:<\/strong> Legen Sie die horizontale Ausrichtung des Textes fest: links, zentriert oder rechts.<\/li>\n<li><strong>Vertikale Ausrichtung:<\/strong> Legen Sie die vertikale Ausrichtung des Textes fest: oben, mittig oder unten.<\/li>\n<li><strong>Aufz\u00e4hlungspunkte:<\/strong> F\u00fcgen Sie dem Text Aufz\u00e4hlungspunkte hinzu. Ein Aufz\u00e4hlungspunkt wird dem Text jedes Mal hinzugef\u00fcgt, wenn ein Zeilenumbruch erfolgt. <\/li>\n<li><strong>Zeile:<\/strong> Passen Sie die H\u00f6he der Textzeilen (in Pixeln) mit den mitgelieferten Spinnern an.<\/li>\n<li><strong>Textsymbole anpassen:<\/strong> Verwenden Sie dieses Steuerelement, um festzulegen, ob die Gr\u00f6\u00dfe des Textfelds durch den Textinhalt oder manuell festgelegt wird.<\/li>\n<\/ul>\n<h4>Blending<\/h4>\n<p>Mit den Mischmodi k\u00f6nnen Sie festlegen, wie zwei Ebenen ineinander \u00fcbergehen sollen. Dazu werden die Pixel jeder Ebene genommen und Berechnungen auf sie angewendet. Auf diese Weise k\u00f6nnen Sie Aspekte eines Bildes anpassen, z. B. die Hintergrundfarbe. Oder Sie erstellen interessante \u00dcberlagerungen und Texturen.   <\/p>\n<ul>\n<li><strong>Multiplizieren:<\/strong> Sieht sich die Farbinformationen in jedem Kanal an und multipliziert die Grundfarbe mit der Mischfarbe. Die Ergebnisfarbe ist immer eine dunklere Farbe. Die Multiplikation einer beliebigen Farbe mit Schwarz ergibt Schwarz. Die Multiplikation einer beliebigen Farbe mit Wei\u00df l\u00e4sst die Farbe unver\u00e4ndert. Wenn Sie mit einer anderen Farbe als Schwarz oder Wei\u00df malen, erzeugen aufeinanderfolgende Striche mit einem Malwerkzeug zunehmend dunklere Farben. Der Effekt ist vergleichbar mit dem Zeichnen auf dem Bild mit mehreren Markierungsstiften.     <\/li>\n<li><strong>Bildschirm:<\/strong> Betrachtet die Farbinformationen der einzelnen Kan\u00e4le und multipliziert den Kehrwert der Misch- und Grundfarben. Die Ergebnisfarbe ist immer eine hellere Farbe. Die Rasterung mit Schwarz l\u00e4sst die Farbe unver\u00e4ndert. Screening mit Wei\u00df ergibt Wei\u00df. Der Effekt ist vergleichbar mit der Projektion mehrerer fotografischer Dias \u00fcbereinander.    <\/li>\n<li><strong>\u00dcberlagern:<\/strong> Vervielfacht oder rastert die Farben, abh\u00e4ngig von der Grundfarbe. Muster oder Farben \u00fcberlagern die vorhandenen Pixel, wobei die Lichter und Schatten der Grundfarbe erhalten bleiben. Die Grundfarbe wird nicht ersetzt, sondern mit der \u00dcberlagerungsfarbe gemischt, um die Helligkeit oder Dunkelheit der Originalfarbe wiederzugeben.  <\/li>\n<li><strong>Abdunkeln:<\/strong> Sieht sich die Farbinformationen in jedem Kanal an und w\u00e4hlt die Grund- oder Mischfarbe &#8211; je nachdem, welche dunkler ist &#8211; als Ergebnisfarbe aus. Pixel, die heller als die Mischfarbe sind, werden ersetzt, und Pixel, die dunkler als die Mischfarbe sind, werden nicht ver\u00e4ndert. <\/li>\n<li><strong>Aufhellen:<\/strong> Betrachtet die Farbinformationen in jedem Kanal und w\u00e4hlt die Grund- oder Mischfarbe &#8211; je nachdem, welche Farbe heller ist &#8211; als Ergebnisfarbe aus. Pixel, die dunkler als die Mischfarbe sind, werden ersetzt, und Pixel, die heller als die Mischfarbe sind, werden nicht ver\u00e4ndert. <\/li>\n<li><strong>Farbe abwedeln:<\/strong> Betrachtet die Farbinformationen in jedem Kanal und hellt die Grundfarbe auf, um die Mischfarbe wiederzugeben, indem der Kontrast zwischen den beiden verringert wird. Die \u00dcberblendung mit Schwarz bewirkt keine Ver\u00e4nderung. <\/li>\n<li><strong>Farbverf\u00e4rbung:<\/strong> Betrachtet die Farbinformationen in jedem Kanal und verdunkelt die Grundfarbe, um die \u00dcberblendungsfarbe wiederzugeben, indem der Kontrast zwischen den beiden erh\u00f6ht wird. Die \u00dcberblendung mit Wei\u00df bewirkt keine Ver\u00e4nderung. <\/li>\n<li><strong>Differenz:<\/strong> Betrachtet die Farbinformationen in jedem Kanal und subtrahiert entweder die Mischfarbe von der Grundfarbe oder die Grundfarbe von der Mischfarbe, je nachdem, welche den gr\u00f6\u00dferen Helligkeitswert hat. Die \u00dcberblendung mit Wei\u00df invertiert die Werte der Grundfarbe; die \u00dcberblendung mit Schwarz bewirkt keine Ver\u00e4nderung. <\/li>\n<li><strong>Ausschluss:<\/strong> Erzeugt einen \u00e4hnlichen Effekt wie der Modus Differenz, aber mit geringerem Kontrast. Das Mischen mit Wei\u00df invertiert die Basisfarbwerte. Das Mischen mit Schwarz bewirkt keine Ver\u00e4nderung.  <\/li>\n<li><strong>Farbton:<\/strong> Erzeugt eine Ergebnisfarbe mit der Luminanz und S\u00e4ttigung der Grundfarbe und dem Farbton der Mischfarbe.<\/li>\n<li><strong>S\u00e4ttigung:<\/strong>Erzeugt eine Ergebnisfarbe mit der Luminanz und dem Farbton der Grundfarbe und der S\u00e4ttigung der Mischfarbe. Das Malen mit diesem Modus in einem Bereich ohne (0) S\u00e4ttigung (grau) bewirkt keine Ver\u00e4nderung. <\/li>\n<li><strong>Farbe:<\/strong> Erzeugt eine Ergebnisfarbe mit der Luminanz der Grundfarbe und dem Farbton und der S\u00e4ttigung der Mischfarbe. Dadurch bleiben die Graustufen im Bild erhalten. Dies ist n\u00fctzlich zum Einf\u00e4rben von Schwarzwei\u00dfbildern und zum Abt\u00f6nen von Farbbildern. <\/li>\n<li><strong>Luminanz:<\/strong><br \/>\nErzeugt eine Ergebnisfarbe mit dem Farbton und der S\u00e4ttigung der Grundfarbe und der Luminanz der Mischfarbe. Dieser Modus erzeugt den umgekehrten Effekt des Modus Farbe. <\/li>\n<\/ul>\n<h4>Hintergrund<\/h4>\n<ul>\n<li><strong>Kontrollk\u00e4stchen:<\/strong> Verwenden Sie dieses Kontrollk\u00e4stchen, um festzulegen, ob das Element einen Hintergrund hat oder nicht.<\/li>\n<li><strong>Farbe:<\/strong> Klicken Sie darauf, um die Hintergrundfarbe mit dem angezeigten Farbauswahldialog zu \u00e4ndern. Sie k\u00f6nnen eine Farbe oder einen Farbverlauf ausw\u00e4hlen und diese mit Hintergrundbildern kombinieren. <\/li>\n<li><strong>Transparenz:<\/strong> Definieren Sie die Transparenz des Elements mit den bereitgestellten Spinnern oder geben Sie einen %-Wert ein.<\/li>\n<li><strong>Bild hinzuf\u00fcgen:<\/strong> Verwenden Sie diese Option, um ein Hintergrundbild f\u00fcr das ausgew\u00e4hlte Element auszuw\u00e4hlen und zu konfigurieren.<\/li>\n<\/ul>\n<h4>Grenze<\/h4>\n<ul>\n<li><strong>Kontrollk\u00e4stchen:<\/strong> Verwenden Sie dieses Kontrollk\u00e4stchen, um festzulegen, ob das Element einen Rahmen hat oder nicht.<\/li>\n<li><strong>Farbe des Rahmens:<\/strong> W\u00e4hlen Sie die Farbe des Rahmens des Elements.<\/li>\n<li><strong>Randbreite:<\/strong> Legen Sie die Breite der R\u00e4nder mit den mitgelieferten Spinnern fest.<\/li>\n<li><strong>Rahmentyp:<\/strong> W\u00e4hlen Sie den Linientyp aus: keine, durchgezogen, gepunktet oder gestrichelt.<\/li>\n<\/ul>\n<h4>Andere Optionen<\/h4>\n<ul>\n<li><strong>Drehung:<\/strong> gibt die Anzahl der Grad der Drehung des ausgew\u00e4hlten Elements an.<\/li>\n<li><strong>Deckkraft:<\/strong> legen Sie die Transparenz des gesamten ausgew\u00e4hlten Elements fest.<\/li>\n<li><strong>Rund:<\/strong> definiert den Grad der Abrundung der Ecken des Elements. Sie k\u00f6nnen auch unabh\u00e4ngig davon definiert werden. <\/li>\n<\/ul>\n<h4>Auswirkungen<\/h4>\n<ul>\n<li style=\"list-style-type: none;\">\n<ul>Wenn Sie auf das &#8222;+&#8220; klicken, werden die Effekte aktiviert. Jeder Effekt hat seine eigenen Eigenschaften, die Sie durch Klicken auf die Mutter aufrufen k\u00f6nnen. Sie k\u00f6nnen auch die Position \u00e4ndern und die Effekte entfernen, indem Sie auf die Symbole auf der rechten Seite klicken.  <\/ul>\n<\/li>\n<\/ul>\n<ul>\n<li><strong>Schlagschatten:<\/strong> F\u00fcgt einen Schatten hinzu, der hinter den Inhalt der Ebene f\u00e4llt.<\/li>\n<li><strong>Innerer Schatten:<\/strong> F\u00fcgt einen Schatten hinzu, der genau auf die Kanten des Ebeneninhalts f\u00e4llt und der Ebene ein vertieftes Aussehen verleiht.<\/li>\n<li><strong>Unsch\u00e4rfe:<\/strong> Das Unsch\u00e4rfen eines Elements verleiht ihm ein sch\u00f6nes Aussehen, verbessert es durch eine geringe Sch\u00e4rfentiefe, die dem Auge schmeichelt.<\/li>\n<li><strong>Helligkeit:<\/strong> Der Anteil von Wei\u00df oder Schwarz, der der Farbe beigemischt ist. Sie wird auch als Prozentwert zwischen 0% und 100% berechnet. <\/li>\n<li><strong>Kontrast:<\/strong> Wenn Sie den Kontrast erh\u00f6hen, machen Sie die dunklen Bereiche dunkler und die hellen Bereiche heller. Dadurch wird der Unterschied oder der Abstand zwischen ihnen vergr\u00f6\u00dfert. <\/li>\n<li><strong>Grauskala:<\/strong> Die Funktion Graustufen wandelt das Eingabeelement in Graustufen um. Der Wert von amount definiert den Anteil der Umwandlung. <\/li>\n<li><strong>Farbton:<\/strong> Sie k\u00f6nnen die Farben des gesamten Spektrums auf dem Farbkreis \u00e4ndern: Rot, Orange, Gelb, Blau, Gr\u00fcn und Violett.<\/li>\n<li><strong>Invertieren:<\/strong> Mit der Aktion Invertieren werden die Farben auf dem ausgew\u00e4hlten Element zu ihren Gegens\u00e4tzen auf der Farbskala.<\/li>\n<li><strong>S\u00e4ttigen:<\/strong> S\u00e4ttigung macht Farben lebendiger, ist die St\u00e4rke einer Oberfl\u00e4chenfarbe, ihr Grad an visuellem Unterschied zum neutralen Grau.<\/li>\n<li><strong>Sepia:<\/strong> Ein Ton, der einem Schwarz-Wei\u00df-Element in der Dunkelkammer hinzugef\u00fcgt wird, um die T\u00f6ne &#8222;w\u00e4rmer&#8220; zu machen (da es sich aber immer noch um ein monochromes Bild handelt, wird es immer noch als Schwarz-Wei\u00df betrachtet).<\/li>\n<\/ul>\n<h2><a id=\"the-outline-palette\"><\/a>Die Palette Ebenen<\/h2>\n<p>Mit der Ebenen-Palette k\u00f6nnen Sie die Elemente der Leinwand ausw\u00e4hlen, organisieren und steuern.<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-40725\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/OutlinePaletteExplained.png\" alt=\"Die Funktionen der Gliederungspalette\" width=\"596\" height=\"333\"><\/p>\n<ol class=\"image-bullet\">\n<li><strong>&#8222;Auge&#8220;-Symbol:<\/strong> Umschalten, um ein Element auf der Leinwand ein- oder auszublenden, damit Sie leichter etwas darunter ausw\u00e4hlen k\u00f6nnen. Diese Eigenschaft blendet das Element in der Simulation nicht aus. Verwenden Sie daf\u00fcr stattdessen die Option im Eigenschaftenbedienfeld.  <\/li>\n<li><strong>Elementgruppen:<\/strong> &#8211; Schalten Sie um, um den Inhalt einer Gruppe oder die Elemente innerhalb eines Containers zu erweitern oder zu reduzieren.<\/li>\n<li><strong>Schaltfl\u00e4chen zum Verschieben von Elementen:<\/strong> Legen Sie mit diesen Pfeilen die Reihenfolge der Elemente auf der Leinwand fest. Sie k\u00f6nnen stattdessen auch Drag &amp; Drop innerhalb dieser Palette verwenden. <\/li>\n<\/ol>\n<h2><a id=\"the-data-master-palette\"><\/a>Die Data Masters-Palette<\/h2>\n<p>Diese Palette listet die Data Master im aktuellen Prototyp auf. Datenmaster sind eine zentrale M\u00f6glichkeit, Daten zu definieren, die eine Datenbank emulieren.   <a href=\"https:\/\/www.justinmind.com\/de\/hilfe\/prototyping-forms-data-lists-and-data-grids\">Wie Sie Data Masters verwenden k\u00f6nnen, erfahren Sie hier.<\/a>  Im Folgenden finden Sie die Details der Palette Data Masters:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16412\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/DataMasterUG.png\" alt=\"Datenstamm-Palette\" width=\"655\" height=\"361\"><\/p>\n<ol class=\"image-bullet\">\n<li><strong>Neuer Datenstamm:<\/strong> Verwenden Sie diese Option, um einen neuen Datenstamm zu erstellen. Wenn Sie auf dieses Symbol klicken, wird der folgende Dialog angezeigt: <img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16413\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/DataMasterDefined.png\" alt=\"Definitionen des Datenstamms\" width=\"919\" height=\"595\">\n<ol class=\"image-bullet\">\n<li>Benennen Sie den Datenstamm<\/li>\n<li>Felder zum Datenstamm hinzuf\u00fcgen<\/li>\n<li>Benennen Sie die Felder<\/li>\n<li>W\u00e4hlen Sie den Feldtyp<\/li>\n<li>W\u00e4hlen Sie ein bestimmtes Feld<\/li>\n<li>Feldeigenschaften \u00e4ndern<\/li>\n<li>Feldpositionen verschieben<\/li>\n<li>Ein Feld l\u00f6schen<\/li>\n<\/ol>\n<p><span style=\"font-weight: 400;\">Die Registerkarte &#8218;Datens\u00e4tze anzeigen und bearbeiten&#8216; im Datenstamm enth\u00e4lt diese Operationen:<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16444\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/ViewAndEditRecords.png\" alt=\"Anzeigen und Bearbeiten von Datens\u00e4tzen des definierten Datenstamms\" width=\"720\" height=\"482\"><\/p>\n<ol class=\"image-bullet\">\n<li>Neue Datens\u00e4tze zum Datenstamm hinzuf\u00fcgen<\/li>\n<li>Anzeigen der Datens\u00e4tze im Datenstamm<\/li>\n<li>W\u00e4hlen Sie einen bestimmten Datensatz<\/li>\n<li>Positionierung des Datensatzes verschieben<\/li>\n<li>Einen ausgew\u00e4hlten Datensatz l\u00f6schen<\/li>\n<li>Importieren Sie Datens\u00e4tze aus einer .csv-Datei.<\/li>\n<li>Datens\u00e4tze aus dem Datenstamm exportieren<\/li>\n<\/ol>\n<\/li>\n<li><strong>Datenstamm aus CSV-Datei erstellen:<\/strong> Verwenden Sie diese Option, um eine CSV-Datei zu importieren und aus deren Inhalt einen Datenstamm zu erstellen.<\/li>\n<li><strong>Datenstamm:<\/strong> Data Master werden mit ihrem Namen und ihren Attributen als Unterelemente aufgelistet. Wenn Sie den Datenmaster auf die Arbeitsfl\u00e4che ziehen, wird automatisch ein Eingabeformular erstellt. <\/li>\n<li><strong>Datenstamm-Attribut:<\/strong> die Attribute der Datenst\u00e4mme werden mit ihren Namen aufgelistet. Wenn Sie ein Attribut auf die Arbeitsfl\u00e4che ziehen, werden ein Eingabefeld und eine Beschriftung erstellt. <\/li>\n<\/ol>\n<h3>Datenstamm-Kategorien<\/h3>\n<p>Datenstammfelder k\u00f6nnen die folgenden Typen sein:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16445\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/DataMasterTypes.png\" alt=\"Datenstamm-Feldtypen\" width=\"949\" height=\"616\"><\/p>\n<p><strong>Text<\/strong> &#8211; w\u00e4hlen Sie ein Feld dieses Typs aus und klicken Sie auf das Zahnradsymbol, um weitere anpassbare Eigenschaften anzuzeigen:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16446\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/TextProperties.png\" alt=\"Eigenschaften der Textart\" width=\"576\" height=\"340\"><\/p>\n<p><strong>Datum<\/strong> &#8211; w\u00e4hlen Sie ein Feld dieses Typs und klicken Sie auf das Zahnradsymbol, um weitere anpassbare Eigenschaften anzuzeigen:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16447\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/DateProperties.png\" alt=\"Datumstyp-Eigenschaften\" width=\"608\" height=\"338\"><\/p>\n<p><strong>Kategorie<\/strong> &#8211; w\u00e4hlen Sie ein Feld dieses Typs und klicken Sie auf das Zahnradsymbol, um weitere anpassbare Eigenschaften zu sehen:<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16448\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/CategoryProperties.png\" alt=\"Kategorie Eigenschaften\" width=\"907\" height=\"567\"><br \/>\nKlicken Sie auf das &#8218;+&#8216;-Symbol, um neue Artikel zu der Kategorie hinzuzuf\u00fcgen.<\/p>\n<p>W\u00e4hlen Sie aus den hinzugef\u00fcgten Kategorien auf der Registerkarte &#8218;Datens\u00e4tze anzeigen und bearbeiten&#8216;.<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16450\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/SelectingCategory.png\" alt=\"Kategorie in Datens\u00e4tzen ausw\u00e4hlen\" width=\"550\" height=\"288\"><\/p>\n<p><strong>Wahr\/Falsch<\/strong> &#8211; w\u00e4hlen Sie den Wert auf der Registerkarte &#8218;Datens\u00e4tze anzeigen und bearbeiten&#8216;.<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16451\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/SelectingTrueFalse.png\" alt=\"Ausw\u00e4hlen des Wertes wahr oder falsch\" width=\"749\" height=\"382\"><\/p>\n<p><strong>Datei-Upload (Bild)<\/strong> &#8211; Hochladen oder Entfernen eines Bildes auf der Registerkarte &#8218;Datens\u00e4tze anzeigen und bearbeiten&#8216;.<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16452\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/FileUpload.png\" alt=\"Bild hochladen in Ansicht und Datens\u00e4tze bearbeiten\" width=\"705\" height=\"374\"><\/p>\n<p><strong>Mehrfachkategorie<\/strong> &#8211; w\u00e4hlen Sie ein Feld dieses Typs und klicken Sie auf das Zahnradsymbol, um weitere anpassbare Eigenschaften zu sehen:<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16453\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/MultiCategory.png\" alt=\"Eigenschaften mehrerer Kategorien\" width=\"882\" height=\"569\">Klicken Sie auf das Symbol &#8218;+&#8216;, um der Mehrfachkategorie neue Elemente hinzuzuf\u00fcgen. W\u00e4hlen Sie aus den hinzugef\u00fcgten Kategorien auf der Registerkarte &#8218;Datens\u00e4tze anzeigen und bearbeiten&#8216;. <\/p>\n<h2><a id=\"simulating-prototypes\"><\/a>Prototypen simulieren<\/h2>\n<p>Klicken Sie auf das Symbol &#8222;Abspielen&#8220; oben rechts in der Mail-Symbolleiste, um das Simulationsfenster einzublenden, in dem der aktuelle Bildschirm auf dem Canvas angezeigt wird.<br \/>\nUm die Simulationseinstellungen zu \u00e4ndern, w\u00e4hlen Sie &#8222;Datei &#8211; Simulieren &#8211; Einstellungen&#8220; aus dem Hauptmen\u00fc. Der folgende Dialog wird angezeigt: <img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-15894\" src=\"https:\/\/www.justinmind.com\/wp-content\/uploads\/2018\/03\/SimulationSettingsNew.png\" alt=\"Einstellungen f\u00fcr die Simulation\" width=\"694\" height=\"536\"><\/p>\n<ol class=\"image-bullet\">\n<li><strong>Bildschirminhalt (f\u00fcr Web-Prototypen):<\/strong> Geben Sie an, ob der Prototyp w\u00e4hrend der Simulation auf die Breite des Browsers erweitert oder auf die designte Breite beschr\u00e4nkt werden soll.<\/li>\n<li><strong>Ma\u00dfstab:<\/strong> legen Sie fest, wie der Prototyp simuliert werden soll:An Bildschirmgr\u00f6\u00dfe anpassen &#8211; passt den Prototyp an die Bildschirmaufl\u00f6sung des ausgew\u00e4hlten Ger\u00e4ts an<br \/>\noder<br \/>\nBenutzerdefiniert &#8211; w\u00e4hlen Sie einen benutzerdefinierten Ma\u00dfstab %.<\/li>\n<li><strong>Top-Leiste einschlie\u00dfen:<\/strong> schlie\u00dft die Top-Leiste im Simulationsmodus ein. Die obere Leiste enth\u00e4lt Optionen f\u00fcr Kommentare und erm\u00f6glicht Ihnen die Navigation zwischen verschiedenen Bildschirmen. <\/li>\n<li><strong>Interaktive Elemente hervorheben:<\/strong> l\u00e4sst die interaktiven Elemente in der Simulation blinken, wenn der Benutzer auf etwas klickt, das nicht interaktiv ist.<\/li>\n<li><strong>Szenarien einbeziehen:<\/strong> Nehmen Sie die Liste der Szenarien in die Simulation auf, damit die Gutachter sie sehen k\u00f6nnen.<\/li>\n<li><strong>Anforderungen einbeziehen:<\/strong> Nehmen Sie die Liste der Anforderungen in den Prototyp auf.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"<p>Lernen Sie das Modul Benutzeroberfl\u00e4che kennen, in dem Sie die visuellen und interaktiven Komponenten von Prototypen erstellen werden. Symbolleiste Die Symbolleiste enth\u00e4lt Schnellbearbeitungsoptionen f\u00fcr das ausgew\u00e4hlte&#8230;<\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[8546,8547],"tags":[],"class_list":["post-129141","post","type-post","status-publish","format-standard","hentry","category-benutzerhandbuch","category-der-arbeitsbereich"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/posts\/129141"}],"collection":[{"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/comments?post=129141"}],"version-history":[{"count":1,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/posts\/129141\/revisions"}],"predecessor-version":[{"id":129184,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/posts\/129141\/revisions\/129184"}],"wp:attachment":[{"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/media?parent=129141"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/categories?post=129141"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/tags?post=129141"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}