Proton/android-mail
1
0
Fork 0
mirror of https://github.com/ProtonMail/android-mail.git synced 2026-05-15 09:50:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update onboarding illustrations

Browse Source 
NOJIRA
This commit is contained in:
Stefanija Boshkovska
2025-08-22 15:43:03 +02:00
committed by Niccolò Forlini
parent c7b1367cb4
commit 435b1f3bb1
7 changed files with 351 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
mail-onboarding/presentation/src/main/kotlin/ch/protonmail/android/mailonboarding/presentation/OnboardingScreen.kt
+2 -2
View File
@@ -83,12 +83,12 @@ private fun OnboardingScreen(
descriptionId = R.string.onboarding_welcome_description
),
OnboardingUiModel(
illustrationId = R.drawable.illustration_onboarding_rebuilt,
illustrationId = R.drawable.illustration_onboarding_focus,
title = R.string.onboarding_rebuilt_title,
descriptionId = R.string.onboarding_rebuilt_description
),
OnboardingUiModel(
illustrationId = R.drawable.illustration_onboarding_feedback,
illustrationId = R.drawable.illustration_onboarding_offline,
title = R.string.onboarding_feedback_title,
descriptionId = R.string.onboarding_feedback_description
),
mail-onboarding/presentation/src/main/res/drawable/illustration_onboarding_feedback.webp
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 58 KiB

mail-onboarding/presentation/src/main/res/drawable/illustration_onboarding_focus.xml
+91
View File
@@ -0,0 +1,91 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="200dp"
android:height="172dp"
android:viewportWidth="200"
android:viewportHeight="172">
<path
android:pathData="M124.95,48C126.58,48 128.14,48.66 129.27,49.83L153.38,74.84C154.1,75.58 154.5,76.58 154.5,77.61V109C154.5,112.31 151.81,115 148.5,115H52.5C49.19,115 46.5,112.31 46.5,109V77.53C46.5,76.54 46.86,75.59 47.52,74.86L69.71,50C70.85,48.73 72.48,48 74.19,48H124.95ZM75.21,50C73.49,50 71.85,50.74 70.71,52.04L49.92,75.68C48.78,76.97 49.7,79 51.42,79H80.36C81.7,79 82.95,79.67 83.69,80.78L87.31,86.22C88.05,87.33 89.3,88 90.64,88H110.36C111.7,88 112.95,87.33 113.69,86.22L117.31,80.78C118.05,79.67 119.3,79 120.64,79H149.35C151.1,79 152.01,76.9 150.8,75.62L128.27,51.87C127.14,50.68 125.57,50 123.92,50H75.21Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="154.5"
android:startY="48"
android:endX="99.89"
android:endY="145.04"
android:type="linear">
<item android:offset="0" android:color="#FFFAEBFF"/>
<item android:offset="1" android:color="#FFEBAAFF"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M123.92,50C125.57,50 127.14,50.68 128.27,51.87L150.8,75.62C152.01,76.9 151.1,79 149.35,79H135.5L128.95,71.92C127.81,70.7 126.22,70 124.54,70H76.46C74.78,70 73.19,70.7 72.05,71.92L65.5,79H51.42C49.7,79 48.78,76.97 49.92,75.68L70.71,52.04C71.85,50.74 73.49,50 75.21,50H123.92Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="151.35"
android:startY="50"
android:endX="137.97"
android:endY="101.85"
android:type="linear">
<item android:offset="0" android:color="#FFF6D8FF"/>
<item android:offset="1" android:color="#FFA171FA"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M72.05,71.92L65.5,79H80.36C81.7,79 82.95,79.67 83.69,80.78L87.31,86.22C88.05,87.33 89.3,88 90.64,88H110.36C111.7,88 112.95,87.33 113.69,86.22L117.31,80.78C118.05,79.67 119.3,79 120.64,79H135.5L128.95,71.92C127.81,70.7 126.22,70 124.54,70H76.45C74.78,70 73.19,70.7 72.05,71.92Z"
android:fillColor="#4F3D99"/>
<path
android:pathData="M127,44m-16,0a16,16 0,1 1,32 0a16,16 0,1 1,-32 0">
<aapt:attr name="android:fillColor">
<gradient
android:startX="140.1"
android:startY="26.13"
android:endX="113.24"
android:endY="54.87"
android:type="linear">
<item android:offset="0" android:color="#FFB4FDDA"/>
<item android:offset="1" android:color="#FF33D0CB"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M120,44.49L125.07,51L134,37"
android:strokeLineJoin="round"
android:strokeWidth="2"
android:fillColor="#00000000"
android:strokeColor="#ffffff"
android:strokeLineCap="round"/>
<path
android:pathData="M54.5,6H38.5C29.66,6 22.5,13.16 22.5,22V38"
android:strokeAlpha="0.3"
android:strokeWidth="4"
android:fillColor="#00000000"
android:strokeColor="#2FCEBA"
android:fillAlpha="0.3"
android:strokeLineCap="round"/>
<path
android:pathData="M22.5,122V138C22.5,146.84 29.66,154 38.5,154H54.5"
android:strokeAlpha="0.3"
android:strokeWidth="4"
android:fillColor="#00000000"
android:strokeColor="#2FCEBA"
android:fillAlpha="0.3"
android:strokeLineCap="round"/>
<path
android:pathData="M146.5,6H162.5C171.34,6 178.5,13.16 178.5,22V38"
android:strokeAlpha="0.3"
android:strokeWidth="4"
android:fillColor="#00000000"
android:strokeColor="#2FCEBA"
android:fillAlpha="0.3"
android:strokeLineCap="round"/>
<path
android:pathData="M178.5,122V138C178.5,146.84 171.34,154 162.5,154H146.5"
android:strokeAlpha="0.3"
android:strokeWidth="4"
android:fillColor="#00000000"
android:strokeColor="#2FCEBA"
android:fillAlpha="0.3"
android:strokeLineCap="round"/>
</vector>
mail-onboarding/presentation/src/main/res/drawable/illustration_onboarding_offline.xml
+113
View File
@@ -0,0 +1,113 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="200dp"
android:height="172dp"
android:viewportWidth="200"
android:viewportHeight="172">
<path
android:pathData="M100,16C138.66,16 170,47.34 170,86C170,112.11 155.7,134.89 134.5,146.92V103C134.5,97.48 130.02,93 124.5,93H75.5C69.98,93 65.5,97.48 65.5,103V146.92C44.3,134.89 30,112.11 30,86C30,47.34 61.34,16 100,16Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="138.5"
android:startY="26"
android:endX="55.5"
android:endY="147"
android:type="linear">
<item android:offset="0" android:color="#0AC990FF"/>
<item android:offset="1" android:color="#266D4AFF"/>
</gradient>
</aapt:attr>
</path>
<group>
<clip-path
android:pathData="M100,86m-70,0a70,70 0,1 1,140 0a70,70 0,1 1,-140 0"/>
<path
android:pathData="M76,93H124C129.52,93 134,97.48 134,103V166H66V103C66,97.48 70.48,93 76,93Z"
android:strokeWidth="4"
android:fillAlpha="0.05">
<aapt:attr name="android:fillColor">
<gradient
android:startX="97.04"
android:startY="106"
android:endX="89.95"
android:endY="170.48"
android:type="linear">
<item android:offset="0" android:color="#FFDDD7FF"/>
<item android:offset="1" android:color="#FFBBB0F9"/>
</gradient>
</aapt:attr>
<aapt:attr name="android:strokeColor">
<gradient
android:startX="124"
android:startY="70"
android:endX="62.5"
android:endY="190.23"
android:type="linear">
<item android:offset="0" android:color="#FFA792FF"/>
<item android:offset="1" android:color="#FF2C1E66"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M116.5,144C117.33,144 118,144.67 118,145.5C118,146.33 117.33,147 116.5,147H84.5C83.67,147 83,146.33 83,145.5C83,144.67 83.67,144 84.5,144H116.5ZM78,138C79.1,138 80,138.9 80,140V142C80,143.1 79.1,144 78,144H76C74.9,144 74,143.1 74,142V140C74,138.9 74.9,138 76,138H78ZM124.5,138C125.33,138 126,138.67 126,139.5C126,140.33 125.33,141 124.5,141H84.5C83.67,141 83,140.33 83,139.5C83,138.67 83.67,138 84.5,138H124.5ZM116.5,129C117.33,129 118,129.67 118,130.5C118,131.33 117.33,132 116.5,132H84.5C83.67,132 83,131.33 83,130.5C83,129.67 83.67,129 84.5,129H116.5ZM78,123C79.1,123 80,123.89 80,125V127C80,128.1 79.1,129 78,129H76C74.9,129 74,128.1 74,127V125C74,123.89 74.9,123 76,123H78ZM124.5,123C125.33,123 126,123.67 126,124.5C126,125.33 125.33,126 124.5,126H84.5C83.67,126 83,125.33 83,124.5C83,123.67 83.67,123 84.5,123H124.5ZM116.5,114C117.33,114 118,114.67 118,115.5C118,116.33 117.33,117 116.5,117H84.5C83.67,117 83,116.33 83,115.5C83,114.67 83.67,114 84.5,114H116.5ZM78,108C79.1,108 80,108.89 80,110V112C80,113.11 79.1,114 78,114H76C74.9,114 74,113.11 74,112V110C74,108.89 74.9,108 76,108H78ZM124.5,108C125.33,108 126,108.67 126,109.5C126,110.33 125.33,111 124.5,111H84.5C83.67,111 83,110.33 83,109.5C83,108.67 83.67,108 84.5,108H124.5Z"
android:fillColor="#B893E1"
android:fillAlpha="0.2"/>
<path
android:pathData="M95.5,98L104.5,98A1.5,1.5 0,0 1,106 99.5L106,99.5A1.5,1.5 0,0 1,104.5 101L95.5,101A1.5,1.5 0,0 1,94 99.5L94,99.5A1.5,1.5 0,0 1,95.5 98z"
android:fillColor="#7462BF"/>
</group>
<path
android:pathData="M100,55m-22,0a22,22 0,1 1,44 0a22,22 0,1 1,-44 0">
<aapt:attr name="android:fillColor">
<gradient
android:startX="117.63"
android:startY="34.42"
android:endX="81.75"
android:endY="76.72"
android:type="linear">
<item android:offset="0" android:color="#FFFFD7B3"/>
<item android:offset="1" android:color="#FFFAA58B"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M94.5,44.37L105.55,63.5"
android:strokeWidth="2"
android:fillColor="#00000000"
android:strokeColor="#ffffff"
android:strokeLineCap="round"/>
<path
android:pathData="M100,61C101.11,61 102,61.9 102,63C102,64.1 101.11,65 100,65C98.9,65 98,64.1 98,63C98,61.9 98.9,61 100,61ZM99.22,58.06C97.98,58.26 96.89,58.91 96.13,59.84C95.78,60.27 95.15,60.33 94.72,59.98C94.29,59.63 94.23,59 94.58,58.57C95.49,57.46 96.73,56.63 98.16,56.25L99.22,58.06ZM100.34,56.01C102.39,56.11 104.21,57.09 105.42,58.57C105.77,59 105.71,59.63 105.28,59.98C104.85,60.33 104.22,60.27 103.87,59.84C103.3,59.13 102.53,58.59 101.66,58.28L100.34,56.01ZM96.62,53.59C94.91,54.2 93.41,55.27 92.27,56.65C91.92,57.08 91.29,57.14 90.87,56.79C90.44,56.44 90.38,55.81 90.73,55.38C92.01,53.82 93.69,52.59 95.6,51.83L96.62,53.59ZM100,51C103.74,51 107.07,52.71 109.27,55.38C109.62,55.81 109.56,56.44 109.14,56.79C108.71,57.14 108.08,57.08 107.73,56.65C105.89,54.42 103.11,53 100,53C99.54,53 99.09,53.03 98.64,53.09L97.57,51.25C98.36,51.08 99.17,51 100,51ZM94.08,49.21C91.91,50.15 90,51.58 88.5,53.37C88.15,53.79 87.51,53.85 87.09,53.49C86.67,53.14 86.61,52.51 86.97,52.08C88.61,50.12 90.7,48.53 93.07,47.47L94.08,49.21ZM100,46C105.23,46 109.92,48.37 113.03,52.08C113.39,52.51 113.33,53.14 112.91,53.49C112.49,53.85 111.86,53.79 111.5,53.37C108.75,50.09 104.62,48 100,48C98.62,48 97.28,48.19 96,48.54L94.97,46.76C96.56,46.27 98.25,46 100,46Z"
android:fillColor="#ffffff"/>
<path
android:pathData="M147,85L145,72.5L195,56L147,85Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="184"
android:startY="52"
android:endX="135.5"
android:endY="101"
android:type="linear">
<item android:offset="0" android:color="#FFC8BBFF"/>
<item android:offset="1" android:color="#FF6F60E2"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M147,85L151,77L195,56L147,85Z"
android:fillColor="#7A62E9"/>
<path
android:pathData="M173.7,89.34C172.78,90.79 170.83,91.16 169.43,90.16L151,77L195,56L173.7,89.34ZM145,72.5L136,65.96C135.28,65.43 135.56,64.28 136.45,64.16L195,56L145,72.5Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="191.56"
android:startY="52.57"
android:endX="152.76"
android:endY="91.57"
android:type="linear">
<item android:offset="0" android:color="#FFE4D9FF"/>
<item android:offset="1" android:color="#FFC4B5FF"/>
</gradient>
</aapt:attr>
</path>
</vector>
mail-onboarding/presentation/src/main/res/drawable/illustration_onboarding_rebuilt.webp
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 49 KiB

mail-onboarding/presentation/src/main/res/drawable/illustration_onboarding_welcome.webp
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 74 KiB

mail-onboarding/presentation/src/main/res/drawable/illustration_onboarding_welcome.xml
+145
View File
@@ -0,0 +1,145 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="200dp"
android:height="172dp"
android:viewportWidth="200"
android:viewportHeight="172">
<path
android:pathData="M99,18C143.65,18 180.87,49.81 189.24,92H186.18C177.85,51.48 141.99,21 99,21C56.01,21 20.15,51.48 11.82,92H8.76C17.13,49.81 54.35,18 99,18Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="103.5"
android:startY="18"
android:endX="103.5"
android:endY="57.5"
android:type="linear">
<item android:offset="0" android:color="#339372E1"/>
<item android:offset="1" android:color="#00573BCC"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M150.63,65a13.88,1.5 0,1 0,27.75 0a13.88,1.5 0,1 0,-27.75 0z"
android:strokeAlpha="0.8"
android:fillColor="#7A7F99"
android:fillAlpha="0.16"/>
<path
android:pathData="M150.63,43.63C150.63,41.14 152.64,39.13 155.13,39.13H173.88C176.36,39.13 178.38,41.14 178.38,43.63V60.88C178.38,63.36 176.36,65.38 173.88,65.38H155.13C152.64,65.38 150.63,63.36 150.63,60.88V43.63Z">
<aapt:attr name="android:fillColor">
<gradient
android:centerX="178.38"
android:centerY="39.13"
android:gradientRadius="38.2"
android:type="radial">
<item android:offset="0" android:color="#FFA792FF"/>
<item android:offset="1" android:color="#FF573BCC"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M172.38,39.13V35.75C172.38,31.4 168.85,27.88 164.5,27.88V27.88C160.15,27.88 156.63,31.4 156.63,35.75V39.13"
android:strokeWidth="3"
android:fillColor="#00000000">
<aapt:attr name="android:strokeColor">
<gradient
android:startX="169.75"
android:startY="26.75"
android:endX="155.5"
android:endY="44"
android:type="linear">
<item android:offset="0" android:color="#FFE2DBFF"/>
<item android:offset="1" android:color="#FFA792FF"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M164.5,48.88C165.74,48.88 166.75,49.88 166.75,51.13C166.75,52.06 166.17,52.87 165.35,53.21L165.84,55.87C165.92,56.33 165.57,56.75 165.1,56.75H163.9C163.43,56.75 163.08,56.33 163.16,55.87L163.64,53.21C162.83,52.87 162.25,52.06 162.25,51.13C162.25,49.88 163.26,48.88 164.5,48.88Z"
android:fillColor="#492FB7"/>
<group>
<clip-path
android:pathData="M161.25,47.88h7v10h-7zM164.5,48.88C165.74,48.88 166.75,49.88 166.75,51.13C166.75,52.06 166.17,52.87 165.35,53.21L165.84,55.87C165.92,56.33 165.57,56.75 165.1,56.75H163.9C163.43,56.75 163.08,56.33 163.16,55.87L163.64,53.21C162.83,52.87 162.25,52.06 162.25,51.13C162.25,49.88 163.26,48.88 164.5,48.88Z"/>
<path
android:pathData="M165.35,53.21L165.07,52.51L164.51,52.74L164.62,53.34L165.35,53.21ZM165.84,55.87L166.58,55.73L166.58,55.73L165.84,55.87ZM165.1,56.75V57.5H165.1L165.1,56.75ZM163.9,56.75L163.9,57.5H163.9V56.75ZM163.16,55.87L163.9,56L163.9,56L163.16,55.87ZM163.64,53.21L164.38,53.34L164.49,52.74L163.93,52.51L163.64,53.21ZM164.5,48.88V49.63C165.33,49.63 166,50.3 166,51.13H166.75H167.5C167.5,49.47 166.16,48.13 164.5,48.13V48.88ZM166.75,51.13H166C166,51.75 165.62,52.29 165.07,52.51L165.35,53.21L165.64,53.9C166.73,53.45 167.5,52.38 167.5,51.13H166.75ZM165.35,53.21L164.62,53.34L165.1,56L165.84,55.87L166.58,55.73L166.09,53.07L165.35,53.21ZM165.84,55.87L165.1,56L165.1,56L165.1,56.75L165.1,57.5C166.04,57.5 166.74,56.65 166.58,55.73L165.84,55.87ZM165.1,56.75V56H163.9V56.75V57.5H165.1V56.75ZM163.9,56.75L163.9,56L163.9,56L163.16,55.87L162.42,55.73C162.26,56.65 162.96,57.5 163.9,57.5L163.9,56.75ZM163.16,55.87L163.9,56L164.38,53.34L163.64,53.21L162.91,53.07L162.42,55.73L163.16,55.87ZM163.64,53.21L163.93,52.51C163.38,52.29 163,51.75 163,51.13H162.25H161.5C161.5,52.38 162.27,53.45 163.36,53.9L163.64,53.21ZM162.25,51.13H163C163,50.3 163.67,49.63 164.5,49.63V48.88V48.13C162.84,48.13 161.5,49.47 161.5,51.13H162.25Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="168"
android:startY="46"
android:endX="157.58"
android:endY="54.36"
android:type="linear">
<item android:offset="0" android:color="#FF6141EA"/>
<item android:offset="1" android:color="#FFA792FF"/>
</gradient>
</aapt:attr>
</path>
</group>
<path
android:pathData="M99,18C149.81,18 191,59.19 191,110C191,115.11 190.58,120.12 189.78,125H8.22C7.42,120.12 7,115.11 7,110C7,59.19 48.19,18 99,18Z">
<aapt:attr name="android:fillColor">
<gradient
android:centerX="99"
android:centerY="18"
android:gradientRadius="184"
android:type="radial">
<item android:offset="0" android:color="#196243E6"/>
<item android:offset="0.52" android:color="#006242E6"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M76,57L124,57A24,24 0,0 1,148 81L148,129A24,24 0,0 1,124 153L76,153A24,24 0,0 1,52 129L52,81A24,24 0,0 1,76 57z">
<aapt:attr name="android:fillColor">
<gradient
android:centerX="100.5"
android:centerY="48.5"
android:gradientRadius="51"
android:type="radial">
<item android:offset="0" android:color="#FFF0EDFF"/>
<item android:offset="1" android:color="#FFFFFFFF"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M107.92,98.52L107.92,98.52L91.62,116.62L70.67,93.56V83.61C70.67,82.47 72,81.84 72.88,82.57L96.12,101.88C98.37,103.74 101.63,103.74 103.88,101.88L107.92,98.52Z"
android:fillType="evenOdd">
<aapt:attr name="android:fillColor">
<gradient
android:startX="92.68"
android:startY="116.94"
android:endX="73.01"
android:endY="48.59"
android:type="linear">
<item android:offset="0" android:color="#FFE3D9FF"/>
<item android:offset="1" android:color="#FF7341FF"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M116.76,91.18L107.92,98.52L107.92,98.52L96.22,108.86C94.22,110.62 91.24,110.67 89.2,108.97L70.67,93.56V123.12C70.67,126.47 73.38,129 76.74,129L116.76,129L120.95,110.18L116.76,91.18Z">
<aapt:attr name="android:fillColor">
<gradient
android:centerX="120.73"
android:centerY="95.81"
android:gradientRadius="58.64"
android:type="radial">
<item android:offset="0.56" android:color="#FF6D4AFF"/>
<item android:offset="0.99" android:color="#FFAA8EFF"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M116.76,91.18V129L123.26,129C126.62,129 129.33,126.28 129.33,122.93V83.61C129.33,82.47 128,81.84 127.12,82.57L116.76,91.18Z"
android:fillType="evenOdd">
<aapt:attr name="android:fillColor">
<gradient
android:startX="148.31"
android:startY="159.3"
android:endX="103.35"
android:endY="61.93"
android:type="linear">
<item android:offset="0.27" android:color="#FFE3D9FF"/>
<item android:offset="1" android:color="#FF7341FF"/>
</gradient>
</aapt:attr>
</path>
</vector>