[\/et_pb_text][et_pb_post_title title=”off” author=”off” date_format=”M j Y” categories=”off” comments=”off” featured_image=”off” admin_label=”Post Date” module_class=”post-date” _builder_version=”4.16″ _module_preset=”default” meta_font=”Nexa Bold||||||||” meta_text_align=”center” meta_text_color=”#000000″ meta_font_size=”48px” meta_line_height=”1.2em” custom_margin=”||0px||false|false” custom_padding=”||0px||false|false” global_colors_info=”{}”][\/et_pb_post_title][et_pb_text module_class=”timer_d” _builder_version=”4.17.6″ _module_preset=”default” text_font=”Helvetica||||||||” text_text_color=”#2ea0d2″ text_orientation=”center” custom_margin=”||0px||false|false” custom_padding=”0px||0px||false|false” global_colors_info=”{}”]<\/p>\n
<\/span> 12<\/span> min read<\/span><\/span><\/p>\n [\/et_pb_text][\/et_pb_column][et_pb_column type=”3_4″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_post_title meta=”off” featured_image=”off” _builder_version=”4.16″ _module_preset=”default” title_font=”Nexa-Bold|800|||||||” title_text_align=”left” title_text_color=”#000000″ title_font_size=”48px” title_line_height=”1.2em” meta_font=”Nexa Regular||||||||” meta_text_align=”left” meta_text_color=”#2ea0d2″ meta_font_size=”15px” meta_line_height=”1.6em” title_font_size_tablet=”42px” title_font_size_phone=”36px” title_font_size_last_edited=”on|phone” global_colors_info=”{}”][\/et_pb_post_title][\/et_pb_column][\/et_pb_row][et_pb_row disabled_on=”off|off|off” _builder_version=”4.9.7″ _module_preset=”default” width=”100%” max_width=”1280px” module_alignment=”center” global_module=”5436″ saved_tabs=”all” locked=”off” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_post_title title=”off” meta=”off” admin_label=”Feature Image” _builder_version=”4.16″ _module_preset=”default” title_font=”Nexa Bold|700|||||||” title_text_align=”left” title_text_color=”#000000″ title_font_size=”48px” title_line_height=”1.2em” meta_font=”Nexa Regular||||||||” meta_text_align=”left” meta_text_color=”#2ea0d2″ meta_font_size=”15px” meta_line_height=”1.6em” title_font_size_tablet=”42px” title_font_size_phone=”36px” title_font_size_last_edited=”on|phone” global_colors_info=”{}”][\/et_pb_post_title][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”2_3,1_3″ module_class=”blog-cnt-row” _builder_version=”4.16″ _module_preset=”default” width=”90%” max_width=”1280px” module_alignment=”center” global_colors_info=”{}”][et_pb_column type=”2_3″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.19.5″ _module_preset=”default” text_font=”Helvetica||||||||” text_text_color=”#26282d” text_font_size=”18px” text_letter_spacing=”0.03em” text_line_height=”1.8em” header_2_font=”Helvetica Bold||||||||” header_2_text_color=”#26282d” header_2_font_size=”50px” header_2_line_height=”54px” header_3_font=”Nexa Bold||||||||” header_3_text_color=”#26282d” header_3_font_size=”24px” header_4_font=”Nexa Bold||||||||” header_4_text_color=”#26282d” hover_enabled=”0″ global_colors_info=”{}” sticky_enabled=”0″]<\/p>\n Building a mobile app is an exciting and rewarding endeavor, and there\u2019s plenty to think about.<\/p>\n There\u2019s the brainstorming and ideation phase<\/a>, design phase, mockup and prototyping phase<\/a>, coding phase, and marketing phase<\/a>.<\/p>\n In short, there are a ton of details, big and small, you\u2019ll need to know about to launch your app successfully<\/a>.<\/p>\n Knowing the differences between screen size and screen resolution is just one of those important details you\u2019ll need to be ready for when building an app for multiple devices.<\/p>\n Let\u2019s take a look.<\/p>\n First, let me start by saying, screen size and screen resolution aren\u2019t the same thing and shouldn\u2019t be used interchangeably.<\/p>\n We\u2019ll get into the details of both in the next section.<\/p>\n It\u2019s crucial to have a good understanding of each of these terms when it comes to developing an app<\/a> because they each have their place in optimizing an app for various devices and screen sizes, like smartphones, tablets, smart TVs and other screens.<\/p>\n You also want to make sure the app looks good when rotating your smartphone from portrait mode to landscape mode.<\/p>\n <\/p> In today\u2019s digital world, building an app with multiple screen sizes in mind shouldn\u2019t be treated as an afterthought.<\/p>\n PRO TIP:<\/strong> As already mentioned, screen size and screen resolution aren’t the same thing.<\/p>\n Screen size refers to the physical dimensions of a device’s display, measured in inches or centimeters. Screen resolution, on the other hand, refers to the number of pixels displayed on a screen, measured in pixels per inch (PPI) or pixels per centimeter (PPCM).<\/p>\n While the two concepts are related, they’re not the same and should be considered separately when developing mobile apps.<\/p>\n For example, a device with a larger screen size may have a lower screen resolution, and vice versa. It’s important for developers to take both screen size and resolution into account when designing and developing apps to ensure a consistent and optimal user experience across different devices.<\/p>\n Let\u2019s take a quick look at some common terminology you\u2019ll find when referring to screen size and resolution.<\/p>\n Pixel, short for picture element<\/a>, is the smallest individual element that makes up a display. It\u2019s the single color dot from which you can create a larger image.<\/p>\n The number of pixels in an image is what determines the resolution.<\/p>\n For example, if you have a 10×10 pixel image, it means that the grid is 10 pixels wide and 10 pixels high, meaning you have a total of 100 pixels.<\/p>\n <\/p> Points aren\u2019t the same thing as pixels<\/a>. This is a unit of length, most often used to measure the height of a font.<\/p>\n 1 point equates to 1\/72th of an inch.<\/p>\n How many pixels equal a single point depends on the resolution of the given image. If you have an image that\u2019s 72ppi (pixels per inch), then one pixel will equal one point.<\/p>\n DPI is short for dots per inch<\/a> and is also sometimes referred to as PPI, which is pixels per inch. DPI calculates the number of pixels in an inch of screen.<\/p>\n DP stands for density independent pixel<\/a>. It\u2019s a unit nearly identical to points and is used by\u00a0Android.<\/p>\n One dp is equal to roughly one pixel on a medium-density screen (160dpi). This is the baseline density, and Android will translate this value to the correct number of actual pixels for other densities.<\/p>\n <\/p> You would use dp when designing Android layouts and points for when designing iOS layouts<\/a>.<\/p>\n Here is how you can convert points and pixels:<\/p>\n iOS Pixels = (Points x DPI) \/ 163<\/p>\n Android Pixels = (DP x DPI) \/ 160<\/p>\n To calculate the pixels per inch (PPI) of a specific device, you’ll need to know the resolution of the device’s screen (measured in pixels) and the physical size of the screen (measured in inches). Once you have that, you can use the following formula to calculate PPI:<\/p>\n PPI = (resolution in pixels) \/ (screen size in inches)<\/p>\n So if a device has a screen resolution of 1080 x 1920 pixels and a screen size of 5 inches, the PPI would be calculated as:<\/p>\n PPI = (1080 x 1920) \/ 5 = 432 PPI<\/p>\n It’s worth noting that PPI is often used as a way to compare the sharpness or clarity of different screens, but it’s not the only metric to take into account.<\/p>\n Viewing distance, color accuracy, contrast, and brightness also play important role in overall visual quality of the device.<\/p>\n 1. Square both resolution numbers and add them together:<\/p>\n (2532 x 2532) + (1170 x 1170) = 7779924<\/p>\n 2. Get the square root of 7779924 = 2789.25<\/p>\n 3. Divide that new number (2789.25) by the screen size (6.1 Inches) = 457 PPI.<\/p>\n According to Apple<\/a>, the PPI they have listed for the iPhone 12 is rounded up to 460 PPI.<\/p>\n PPI is important because it tells you how well that image will be displayed on a specific device.<\/p>\n Just like with iOS, Android also runs on several different devices, each of which have varying screen sizes and even pixel densities.<\/p>\n When you develop an app, you need to make sure the system will scale and resize to adapt its UI interface<\/a> to these different screens.<\/p>\n If you\u2019re developing for Android applications, be sure to check out their thorough documentation on how to adapt your app accordingly<\/a>.<\/p>\n Let\u2019s run through some basics for developing an app for Android screen compatibility.<\/p>\n The screen size takes into account things like the screen orientation, screen UI elements, like a navigation bar, and changes to the window configuration, like multi-window mode<\/a>.<\/p>\n By default, your app\u2019s layout will be resized by Android to fit the screen it\u2019s being viewed on.<\/p>\n To ensure it resizes well, app developers will need to implement a flexible app layout.<\/p>\n For example, rather than hard-coding the size and positioning of UI elements, it\u2019s better to allow view sizes to stretch. Specify their positions relative to the parent or sibling views so the intended sizes remain the same even as the layout changes.<\/p>\n While flexibility is important, so too is having alternative layout designs to optimize the user experience.<\/p>\n Android allows you to use alternative layout design files that the platform will use at runtime based on the screen size of the device being used.<\/p>\n PRO TIP:<\/strong> Android solves this by using nine-patch bitmaps where you can specify the small pixel regions that can stretch, leaving the remainder of the image unscaled.<\/p>\n Pixel density is essentially the DPI, which if you remember from our previous section, is the number of pixels in a physical area of the screen.<\/p>\n The goal when developing your app is that it has density independence<\/a>, which is when it has the ability to maintain the physical size of the UI design when shown on screens with varying pixel densities.<\/p>\n This is important because without it, UI components, like a button, for example, might look too big on a low-density screen or too small on a high-density screen.<\/p>\n It\u2019s also crucial to ensure your images look their best on all screens by providing alternative bitmaps<\/a> to match various screen densities.<\/p>\n For instance, if you only have bitmaps for medium density screens, it might not look good when Android automatically scales them up on high-density screens.<\/p>\n <\/p> In some cases, you can avoid having to create separate images for each density by using vector graphics.<\/p>\n Since vector graphics uses geometric line paths rather than pixels, they can be drawn at any size without scaling issues.<\/p>\n Android offers all of the tools and documentation you need to ensure your app is configured and available for all screen sizes.<\/p>\n However, you can declare your mobile application supports only specific screens<\/a> if you don\u2019t want it available on certain screen configurations due to incompatibility.<\/p>\n Android allows you to limit how much it can resize your app and even restrict which devices can install that app.<\/p>\n You can declare a maximum aspect ratio, a maximum screen size, and restrict your app for specific sizes and densities, if you\u2019d like.<\/p>\n With that said, Android recommends you design your app so it can adapt to all screen sizes and densities.<\/p>\n iOS has similar guidelines for the visual design and layout<\/a> of mobile apps, but it\u2019s a bit more strict and less forgiving.<\/p>\n Let\u2019s take a brief look at what you need to know when developing an iOS application in regards to adaptivity and layout.<\/p>\n <\/p> iOS has many screen sizes which can be used in portrait or landscape orientation.<\/p>\n All devices have a rectangular, edge-to-edge display.<\/p>\n If you visit the iOS documentation page<\/a>, you can see every device as well as the corresponding dimensions.<\/p>\n iOS uses a coordinate system based on measurements in points, which translate to pixels in the display.<\/p>\n A standard, baseline resolution has 1:1 pixel density, with 1 pixel equating to 1 point. Since higher resolution displays have higher pixel density, they demand images with a greater number of pixels.<\/p>\n <\/p> If you have a standard resolution image that\u2019s 100px x 100px, for example, the @2x version would scale it up to 200px x 200px, and @3x would scale it up to 300px x 300px.<\/p>\n PRO TIP:<\/strong> Here are some tips on designing high-res art for iOS<\/a> mobile apps:<\/p>\n As you can tell from these past two chapters on iOS and Android guidelines<\/a>, there\u2019s a ton of details you\u2019ll need to know about and implement when creating an app for multiple devices and screen sizes.<\/p>\n When in doubt, read the docs! Both platforms come with thorough documentation on best practices and specifications for designing an app on multiple devices.<\/p>\n Whether you\u2019re a designer<\/a>, app developer<\/a>, or entrepreneur, developing a mobile app<\/a> that\u2019s available for multiple devices will require knowledge on various design aspects, like screen size and resolution.<\/p>\n Familiarize yourself with all of the terminology involved and read the documentation given by the platform you\u2019re developing for to ensure your app is set up for success.<\/p>\n And most importantly, don’t be afraid to get the help you need.<\/p>\n Our Simple Starter<\/a> is a three-step approach that sets the stage for the development of your app: a technical writeup, which is like a blueprint for your app, wireframing to bring the technical writeup to life, and last, target user analysis that involves heavy market research into your app’s niche.<\/p>\n What checklists and tools do you use when designing an app for all devices?<\/strong><\/p>\n [\/et_pb_text][et_pb_comments _builder_version=”4.11.4″ _module_preset=”default” form_field_background_color=”#FFFFFF” form_field_focus_background_color=”#FFFFFF” header_font=”Helvetica||||||||” header_text_align=”left” title_font=”Helvetica|700|||||||” title_text_align=”left” title_text_color=”#2ea0d2″ title_font_size=”25px” title_line_height=”1.2em” meta_font=”Helvetica||||||||” meta_text_color=”#000000″ body_font=”Helvetica||||||||” body_text_align=”left” body_font_size=”16px” body_line_height=”1.6em” form_field_font=”Helvetica||||||||” form_field_text_align=”left” custom_button=”on” button_text_color=”#2ea0d2″ button_bg_color=”#FFFFFF” button_border_color=”#2ea0d2″ button_font=”Helvetica||||||||” button_use_icon=”off” button_alignment=”right” text_orientation=”left” border_width_bottom=”1px” border_color_bottom=”#e5e5e5″ border_radii_fields=”on|5px|5px|5px|5px” border_width_all_fields=”1px” border_color_all_fields=”#c6c6c6″ global_module=”5439″ saved_tabs=”all” global_colors_info=”{}” button_bg_color__hover_enabled=”on|hover” button_bg_color__hover=”#2ea0d2″ button_bg_enable_color__hover=”on” button_border_color__hover_enabled=”off|hover” button_text_color__hover_enabled=”on|hover” button_text_color__hover=”#FFFFFF”][\/et_pb_comments][et_pb_text disabled_on=”on|on|on” admin_label=”Up Next” _builder_version=”4.9.7″ _module_preset=”default” text_font=”Helvetica|||on|||||” text_text_color=”#9e9e9e” text_font_size=”20px” width=”100%” max_width=”50%” module_alignment=”left” custom_margin=”-50px|0px|0px|0px|false|false” custom_margin_tablet=”0px||||false|false” custom_margin_phone=”0px|0px|0px|0px|false|false” custom_margin_last_edited=”off|desktop” custom_padding=”50px||||false|false” custom_css_main_element=”float: left;||margin-bottom:0px !important;” disabled=”on” global_module=”6525″ locked=”off” global_colors_info=”{}”]<\/p>\n Up Next<\/p>\n [\/et_pb_text][et_pb_post_title title=”off” date=”off” categories=”off” comments=”off” featured_image=”off” disabled_on=”on|on|on” admin_label=”Author” module_class=”author-bottom” _builder_version=”4.9.7″ _module_preset=”default” meta_font=”Journal||||||||” meta_text_align=”right” meta_text_color=”#0ab1db” meta_font_size=”35px” width=”100%” max_width=”50%” module_alignment=”right” custom_margin=”0px|40px|0px|0px|true|false” custom_css_post_title=”float: right;||margin: 0px !important;||margin-right: 40px !important;” disabled=”on” global_module=”5440″ saved_tabs=”all” global_colors_info=”{}”][\/et_pb_post_title][et_pb_sidebar area=”et_pb_widget_area_2″ show_border=”off” disabled_on=”on|on|on” _builder_version=”4.9.7″ _module_preset=”default” header_font=”|700|||||||” header_text_color=”#000000″ header_font_size=”0px” header_line_height=”1.1em” body_font=”Helvetica Bold|700|||||||” body_text_align=”left” body_text_color=”#000000″ body_font_size=”35px” body_line_height=”1.2em” custom_margin=”-20px||||false|false” custom_margin_tablet=”” custom_margin_phone=”0px||0px||false|false” custom_margin_last_edited=”on|phone” disabled=”on” global_module=”5442″ saved_tabs=”all” global_colors_info=”{}”][\/et_pb_sidebar][et_pb_text admin_label=”Read Time” module_class=”timer_d” _builder_version=”4.11.4″ _module_preset=”default” text_font=”Helvetica||||||||” text_text_color=”#26282d” text_font_size=”20px” custom_margin=”0px||50px||false|false” custom_padding=”0px||50px||false|false” border_width_bottom=”1px” border_color_bottom=”#e5e5e5″ global_module=”6522″ locked=”off” global_colors_info=”{}”]<\/p>\n Up Next<\/p>\n\t\t![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Iso4-Webiotic-1024x320-1.jpg\")
<\/figure>\nTable of Contents<\/h3>\n
\n
Chapter #1: Screen Resolution vs Screen Size: Why it Matters<\/h2>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Stat-Webiotic-1.jpg\")
<\/figure>\n![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-MobileTraffic-Webiotic1-1024x576-1.jpg\")
<\/p>\n
Apps that don\u2019t follow specific guidelines, like adhering to screen size and resolution rules set by Apple, for instance, won\u2019t have a chance at being accepted in app stores<\/a>.<\/p>\nChapter #2: What these Terms Mean<\/h2>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-iPhone12-Webiotic-1024x980-1.jpg\")
<\/figure>\n2.1 Common Terminology<\/h3>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Iso1-Webiotic-1024x789-1.jpg\")
<\/figure>\nPixels<\/h4>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Top10-Webiotic-1024x872-1.jpg\")
<\/p>\nPoints<\/h4>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-DigitalChange-Webiotic-1024x982-1.jpg\")
<\/figure>\nDPI<\/h4>\n
DP<\/h4>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Density-Independent-Webiotic-1024x613-1.jpg\")
<\/p>\n2.2 How to Calculate PPI<\/h3>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Android-Pixel-Density-Webiotic-1024x693-2.jpg\"){kind=tracking}
<\/figure>\n![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-iphone-sizes-Webiotic-1024x792-1.jpg\")
<\/figure>\n![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Iso7-Webiotic-1024x1014-1.jpg\")
<\/figure>\nChapter #3: Android Screen Compatibility Review<\/h2>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-MultiscreenWorld-Webiotic-1.jpg\")
<\/figure>\n3.1 Screen Sizes<\/h3>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Iso2-Webiotic-1.jpg\")
<\/figure>\n![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-alt-layouts-Webiotic-1024x648-1.jpg\")
<\/figure>\n
Since your layout should stretch to accommodate the current screen size, your images should also be able to stretch without getting skewed.<\/p>\n3.2 Pixel Density<\/h3>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Iso5-Webiotic-1024x877-1.jpg\")
<\/figure>\n![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Bitmap-Webiotic-1.jpg\")
<\/p>\n3.3 Screen Incompatibility<\/h3>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Stat2-Webiotic-1024x645-1.jpg\")
<\/figure>\nChapter #4: iOS Adaptivity and Layout<\/h2>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Eye-Webiotic-e1620400672157-1.jpg\")
<\/p>\n4.1 Screen Sizes and Orientations<\/h3>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-iOS-Devices-Webiotic-1024x740-1.jpg\")
<\/figure>\n4.2 Image Size and Resolution<\/h3>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Pixel-Density-Webiotic-1.jpg\"){kind=tracking}
<\/p>\n
Provide high-res images for all devices your app will support. You can do this by multiplying the number of pixels in each image by a specific scale factor (e.g. @2x, @3x).<\/p>\n4.3 Design High-Resolution Artwork<\/h3>\n
\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Dimensions-Webiotic-1024x669-1.jpg\")
<\/figure>\n4.4 Read the Docs<\/h3>\n
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/Screen-Size-and-Resolution-Iso3-Webiotic-e1620402160920-1024x565-1.jpg\")
<\/figure>\nFinal Thoughts<\/h2>\n
![](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/asaf.png\"\/)
Asaf<\/span>\n\t\t<\/div>\n\t\t
![](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/night-out-app-header-webiotic.jpg\"\/)
<\/a><\/div>\n\t\t\n\t\t![](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/asaf.png\")
![\"\"](\"https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/grey_calender_002-1.png\")
[\/et_pb_code][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ module_class=”fixed-image” _builder_version=”4.9.7″ _module_preset=”default” z_index=”4″ custom_margin=”-30px||0px||false|false” custom_padding=”0px||0px||false|false” global_module=”6228″ saved_tabs=”all” global_colors_info=”{}”][et_pb_row _builder_version=”4.16″ _module_preset=”default” width=”100%” max_width=”100%” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/newsletter_bg.png” title_text=”newsletter_bg” _builder_version=”4.16″ _module_preset=”default” position_origin_a=”center_left” z_index=”3″ width=”100%” max_width=”35%” custom_css_main_element=”position: absolute;||width: 100%;||height: 100%;||top: 50%;||left: 0;||” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ module_class=”form-section” _builder_version=”4.16″ _module_preset=”default” background_color=”rgba(255,255,255,0)” background_enable_image=”off” background_size=”contain” background_position=”center_left” z_index=”5″ width=”100%” max_width=”100%” custom_padding=”0px||||false|false” background_last_edited=”on|phone” background_enable_image_phone=”off” global_module=”6229″ saved_tabs=”all” global_colors_info=”{}”][et_pb_row disabled_on=”on|off|off” _builder_version=”4.16″ _module_preset=”default” width=”100%” max_width=”100%” module_alignment=”center” custom_margin=”||0px||false|false” custom_padding=”||0px||false|false” scroll_scaling=”0|50|50|100|70|100|85%” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/architsingh.com\/webioticnew\/wp-content\/uploads\/2020\/12\/heart.png” title_text=”heart” align=”center” _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][et_pb_text admin_label=”Your inbox wants some love.” _builder_version=”4.16″ _module_preset=”default” text_font=”Nexa Regular||||||||” text_text_color=”#010101″ text_font_size=”48px” text_orientation=”center” text_font_size_tablet=”” text_font_size_phone=”28px” text_font_size_last_edited=”on|phone” global_colors_info=”{}”]<\/p>\n