Updated Welcome screen first run

CURA-8094 Cura onboarding flow

resources/qml/WelcomePages/WelcomeContent.qml

@@ -7,7 +7,6 @@ import QtQuick.Controls 2.3
 import UM 1.3 as UM
 import Cura 1.1 as Cura
 
-
 //
 // This component contains the content for the "Welcome" page of the welcome on-boarding process.
 //
@@ -15,11 +14,20 @@ Item
 {
     UM.I18nCatalog { id: catalog; name: "cura" }
 
-    Column  // Arrange the items vertically and put everything in the center
+    // Arrange the items vertically and put everything in the center
+    Column
     {
-        anchors.centerIn: parent
+        anchors.horizontalCenter: parent.horizontalCenter
-        width: parent.width
+        anchors.verticalCenter: parent.verticalCenter
-        spacing: 2 * UM.Theme.getSize("wide_margin").height
+        spacing: UM.Theme.getSize("thick_margin").height
+
+        Image
+        {
+            id: curaImage
+            anchors.horizontalCenter: parent.horizontalCenter
+            source: UM.Theme.getImage("first_run_welcome_cura")
+            scale: 0.666
+        }
 
         Label
         {
@@ -28,23 +36,16 @@ Item
             horizontalAlignment: Text.AlignHCenter
             text: catalog.i18nc("@label", "Welcome to Ultimaker Cura")
             color: UM.Theme.getColor("primary_button")
-            font: UM.Theme.getFont("huge")
+            font: UM.Theme.getFont("huge_bold")
             renderType: Text.NativeRendering
         }
 
-        Image
-        {
-            id: curaImage
-            anchors.horizontalCenter: parent.horizontalCenter
-            source: UM.Theme.getImage("first_run_welcome_cura")
-        }
-
         Label
         {
             id: textLabel
             anchors.horizontalCenter: parent.horizontalCenter
             horizontalAlignment: Text.AlignHCenter
-            text: catalog.i18nc("@text", "Please follow these steps to set up\nUltimaker Cura. This will only take a few moments.")
+            text: catalog.i18nc("@text", "Please follow these steps to set up Ultimaker Cura.\nThis will only take a few moments.")
             font: UM.Theme.getFont("medium")
             color: UM.Theme.getColor("text")
             renderType: Text.NativeRendering
@@ -54,7 +55,6 @@ Item
         {
             id: getStartedButton
             anchors.horizontalCenter: parent.horizontalCenter
-            anchors.margins: UM.Theme.getSize("wide_margin").width
             text: catalog.i18nc("@button", "Get started")
             onClicked: base.showNextPage()
         }

resources/themes/cura-light/images/first_run_welcome_cura.svg

@@ -1,11 +1,17 @@
-<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 325.48 197.18">
-<svg width="120px" height="72px" viewBox="0 0 120 72" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <defs>
-    <!-- Generator: Sketch 52.6 (67491) - http://www.bohemiancoding.com/sketch -->
+        <style>.cls-1,.cls-4{fill:#f3f8fe;}.cls-1,.cls-5{stroke:#061884;}.cls-1,.cls-6{stroke-miterlimit:10;}.cls-1,.cls-5,.cls-6,.cls-7{stroke-width:2px;}.cls-2,.cls-5{fill:#fff;}.cls-3{fill:#061884;}.cls-5,.cls-7{stroke-linecap:round;stroke-linejoin:round;}.cls-6,.cls-7{fill:none;stroke:#2c3278;}</style>
-    <title>cura</title>
+    </defs>
-    <desc>Created with Sketch.</desc>
+    <g id="Software">
-    <g id="Iteration-4" stroke="none" stroke-width="1" fill="#000000" fill-rule="nonzero">
+        <path class="cls-1" d="M47.68,9.26H277.81a6.1,6.1,0,0,1,6.1,6.1V172.48a0,0,0,0,1,0,0H41.57a0,0,0,0,1,0,0V15.36a6.1,6.1,0,0,1,6.1-6.1Z"/>
-        <path d="M114.3,63.1 C112.104248,65.5577268 108.994324,67.0042033 105.7,67.1 L14.3,67.1 C11.0056762,67.0042033 7.89575168,65.5577268 5.7,63.1 L114.3,63.1 Z M120,59.1 L0,59.1 L0,59.9 C0,64.5 6.3,71.1 14.3,71.1 L105.7,71.1 C113.7,71.1 120,64.4 120,59.9 L120,59.1 Z" />
+        <path class="cls-2" d="M50.88,173.48a1,1,0,0,1-1-1V19.57a2,2,0,0,1,2-2H272.61a3,3,0,0,1,3,3V172.48a1,1,0,0,1-1,1Z"/>
-        <path d="M106,4.9 L106,59.1 L14,59.1 L14,4.9 L106,4.9 Z M110,0.9 L10,0.9 L10,63.1 L110,63.1 L110,0.9 Z" />
+        <path class="cls-3" d="M272.61,18.57a2,2,0,0,1,2,2V172.48H50.88V19.57a1,1,0,0,1,1-1H272.61m0-2H51.88a3,3,0,0,0-3,3V172.48a2,2,0,0,0,2,2H274.61a2,2,0,0,0,2-2V20.57a4,4,0,0,0-4-4Z"/>
-        <path d="M60.5,36.5 L72.3,36.5 L72.3,43.1 L60.5,43.1 C52.8,43.1 48,37.8 48,30.3 C48,22.8 52.7,17.6 60.5,17.6 L72.3,17.6 L72.3,24.2 L60.5,24.2 C56.6,24.2 54.6,27 54.6,30.3 C54.6,33.7 56.6,36.5 60.5,36.5 Z M52.3,8.9 L36.9,24.5 L36.9,55.1 L67.6,55.1 L83.2,39.5 L83.2,8.9 L52.3,8.9 Z" />
+        <path class="cls-4" d="M272.61,20.57V170.48H52.88V20.57H272.61m0-2H51.88a1,1,0,0,0-1,1V172.48H274.61V20.57a2,2,0,0,0-2-2Z"/>
+        <line class="cls-5" x1="14.64" y1="187.91" x2="310.85" y2="187.91"/>
+        <path class="cls-4" d="M35.34,187.91a15.49,15.49,0,0,1-15.48-15.48,1,1,0,0,1,1-1H304.63a1,1,0,0,1,1,1,15.5,15.5,0,0,1-15.49,15.48Z"/>
+        <path class="cls-3" d="M304.63,172.43h0a14.48,14.48,0,0,1-14.49,14.48H35.34a14.48,14.48,0,0,1-14.48-14.48H304.63m0-2H20.86a2,2,0,0,0-2,2,16.49,16.49,0,0,0,16.48,16.48h254.8a16.5,16.5,0,0,0,16.49-16.48,2,2,0,0,0-2-2Z"/>
+        <path class="cls-3" d="M185.24,172.43h-45v.6a4.4,4.4,0,0,0,4.4,4.4h36.21a4.4,4.4,0,0,0,4.39-4.4Z"/>
+        <polygon class="cls-6" points="180.22 140.51 117.36 140.51 117.36 77.7 144.3 50.78 207.16 50.78 207.16 113.59 180.22 140.51"/>
+        <path class="cls-7" d="M175.73,73.21H162.26a22.44,22.44,0,1,0,0,44.87h13.47"/>
     </g>
-</svg>
+</svg>

resources/themes/cura-light/theme.json

@@ -34,6 +34,11 @@
             "weight": 50,
             "family": "Noto Sans"
         },
+        "huge_bold": {
+            "size": 1.8,
+            "weight": 63,
+            "family": "Noto Sans"
+        },
         "medium": {
             "size": 1.16,
             "weight": 40,
@@ -576,7 +581,7 @@
 
         "monitor_preheat_temperature_control": [4.5, 2.0],
 
-        "welcome_wizard_window": [46.0, 45],
+        "welcome_wizard_window": [43, 43],
         "modal_window_minimum": [60.0, 45],
         "license_window_minimum": [45, 45],
         "wizard_progress": [10.0, 0.0],