<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Mariana Garnica</title>
    <description>The latest articles on Forem by Mariana Garnica (@garn0080).</description>
    <link>https://forem.com/garn0080</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F578826%2F1fd61187-39b3-473f-9977-03b52f23eb10.jpeg</url>
      <title>Forem: Mariana Garnica</title>
      <link>https://forem.com/garn0080</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/garn0080"/>
    <language>en</language>
    <item>
      <title>Native vs Web Development</title>
      <dc:creator>Mariana Garnica</dc:creator>
      <pubDate>Thu, 01 Apr 2021 02:10:12 +0000</pubDate>
      <link>https://forem.com/garn0080/native-vs-web-development-19n0</link>
      <guid>https://forem.com/garn0080/native-vs-web-development-19n0</guid>
      <description>&lt;p&gt;When creating a new application, It's better to start by understanding and defining the type of app that will be built, taking into account the platform used, its main features, performance, security, among other characteristics.&lt;/p&gt;

&lt;p&gt;In this blog, rather than focus on determining which type of application is better between Native and Web app, we'll be addressing the pros and cons of each kind; and leave to the reader the decision upon choosing the one that best complies with its necessities.&lt;/p&gt;

&lt;h2&gt;
  
  
  Web Applications
&lt;/h2&gt;

&lt;p&gt;These types of apps run on browsers and most of them tend to be built with HTM5L, CSS, Javascript. Compared to mobile apps they are easier to build but much simpler in terms of features. Most of them are created in a responsive way, which allows users to access the application on any device.&lt;/p&gt;

&lt;h3&gt;
  
  
  Pros
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;You can build for IOS, Android and Web on the same project: they have common codebases regardless of the mobile platform. This reduces the production costs.&lt;/li&gt;
&lt;li&gt;Don't need to be downloaded or installed: they work on internet browser environments which means that saves storage on your device.&lt;/li&gt;
&lt;li&gt;Don't require approval to be launched, so the publishing process is quicker and easier.&lt;/li&gt;
&lt;li&gt;It's easier to maintain and update.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Cons
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;They may not be as discoverable as mobile apps as they are not listed in a specific platform such as Play Store or App Store.&lt;/li&gt;
&lt;li&gt;Restricted access to native device features: Features such as notifications, camera, fingerprint validation, among others.&lt;/li&gt;
&lt;li&gt;Don't need to be Approved: this could also be a disadvantage because it increases the creation of not standardized sites, not protecting users from bad user experiences.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Native Applications
&lt;/h2&gt;

&lt;p&gt;These types of apps are built specifically for each operating system (iOS, Android) and they are only accessible through app stores such as App Store or Google Play. They are usually built with the native programing language of each platform for better performance. Swift, Objective-C for iOS Applications and Java, Kotlin for Android Apps.&lt;/p&gt;

&lt;h3&gt;
  
  
  Pros
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Fast and responsive: After downloading the app, the Content and visual elements are already stored on the phone which means loading times are quicker compared to apps that run on browsers.&lt;/li&gt;
&lt;li&gt;User Experience: Native apps stick to platform guidelines that align the user interaction with specific operating systems. These guidelines provide more natural and smooth behaviours.&lt;/li&gt;
&lt;li&gt;Native Apps Allow Develop: Native apps take full advantage of the software and operating systems' features. The apps are able to access the hardware of the device easily. These include GPS, Camera, Microphone, etc.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Cons
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Price: They are very costly, you would need to have 2 different source codes to develop an android and iOS app. which means more human resources, developers and designers for both platforms. The maintenance process should also be considered.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Hybrid apps such as PWA are getting a high demand and interest among developers. They are faster to build than Native apps, they could be developed for both platforms, they can work online, between other great features, it is worth it to give them a look.&lt;/p&gt;

&lt;p&gt;Now, there is no good or bad app type it all depends on the goal you are trying to achieve as a developer. Feel free to choose the one that best suits your user's needs. Thanks for reading.&lt;/p&gt;

</description>
      <category>developer</category>
    </item>
    <item>
      <title> Create a simple Animoji with AR</title>
      <dc:creator>Mariana Garnica</dc:creator>
      <pubDate>Mon, 08 Mar 2021 03:22:44 +0000</pubDate>
      <link>https://forem.com/garn0080/test-491l</link>
      <guid>https://forem.com/garn0080/test-491l</guid>
      <description>&lt;p&gt;In this tutorial, we'll learn how to create an Animoji using Reality Composer and ARKit within Swift. Let's start with the definition of Animoji: It is an interactive filter that is featured in modern iPhones and uses face recognition to track face patterns. &lt;br&gt;
We will focus on creating a character that can wink and blink at the same time that we are doing the same action.&lt;/p&gt;

&lt;p&gt;The final result of the App would look like this:&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--xcD33pLP--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j383yeljxd5a2qqklv3c.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--xcD33pLP--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j383yeljxd5a2qqklv3c.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Let's begin!&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;First Create a new project in Xcode, chose Augmented reality Application type.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--ROitnXdJ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x9crdw1d7r56xf8y1k5r.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ROitnXdJ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x9crdw1d7r56xf8y1k5r.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
Then set the project settings, make sure to select RealityKit as "Content Technology"&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--LZYZqFia--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p8904o1p6jv3rseuomrz.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--LZYZqFia--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p8904o1p6jv3rseuomrz.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;On your Project folder select the .rcproject file and chose the option on the right top corner that says "Open in Reality Composer".&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--bV2H7coN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ssrzg0cenbh9hmyzupxn.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--bV2H7coN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ssrzg0cenbh9hmyzupxn.png" alt="Alt Text"&gt;&lt;/a&gt; This will open the application where you'll be able to create your own shapes and/or use the built-in figures.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Then, head over to the properties panel and make sure to select the Face Anchor type.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;On the top, you'll find a series of objects and shapes that you can integrate into the face model. &lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Nz1tFBBn--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x4yz3jv0bdxalveiqldz.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Nz1tFBBn--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x4yz3jv0bdxalveiqldz.png" alt="Alt Text"&gt;&lt;/a&gt; Start designing your Animoji, eyes, mouth, ears, etc. You can set colours and object materials on the properties panel. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Before going to the code we must set identifiers to both of the eyes objects that the character has, like this:&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--UtPZtQCI--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/44upf4byjdsg4pg19i8s.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--UtPZtQCI--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/44upf4byjdsg4pg19i8s.png" alt="Alt Text"&gt;&lt;/a&gt; &lt;em&gt;(make sure to use proper names that you can easily identify)&lt;/em&gt;.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Next, add an identifier name to our scene opening the top left scene tab.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;A Scene is a collection of entities that contain Anchors, Objects, Behaviours and the Physics world&lt;/em&gt;.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--f0SLFWW9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zajlec98gzvfd5zvrn2t.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--f0SLFWW9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zajlec98gzvfd5zvrn2t.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Open the ViewController.swift file and import at the top the ARKit that will allow us to use our front camera and track our facial movements.&lt;br&gt;
&lt;code&gt;import ARKit&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Add the &lt;code&gt;ARSessionDelegate&lt;/code&gt; to the ViewController Class to control and follow the changes on face anchors.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Create a variable that will save the scene created on reality composer. Then create 2 more variables for the eyes, set them as Entity type. &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;Entity is every object created on the reality composer scene&lt;/em&gt;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--jI1c6QwW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1smlre71otfedufsx57j.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jI1c6QwW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1smlre71otfedufsx57j.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;create a &lt;code&gt;viewWillAppear(- animated: bool)&lt;/code&gt; function, it will load the view by itself. Inside it, create a Face Tracking configuration constant to detect faces in device's front camera feed and run the arView session setting a delegate.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--YYfoeXOn--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/adeqqhv7ht112xwltsp7.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--YYfoeXOn--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/adeqqhv7ht112xwltsp7.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Load the Animoji scene with &lt;code&gt;Anchor variable name = rcproject file name.loadAnimoji()&lt;/code&gt;. If desired use try/catch to handle load scene errors and then, append it to the arView scene.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--k4KZqVin--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ss3evr35xvg77yk36atu.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--k4KZqVin--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ss3evr35xvg77yk36atu.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Target the eye objects on reality composer and save them on the global variables previously created.&lt;br&gt;
&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;code&gt;eyeRight = schnauzerAnchor.findEntity(named: "eyeRight")!&lt;br&gt;
eyeLeft = schnauzerAnchor.findEntity(named: "eyeLeft")!&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Make sure that the names match with the identifiers set on reality composer objects&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Handle the eye blink: Create a session function &lt;code&gt;func session (_ session:ARSession, didUpdate frame: ARFrame)&lt;/code&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;ul&gt;
&lt;li&gt;set a variable to store the ARFaceAnchor object to find face anchors.&lt;/li&gt;
&lt;li&gt;Make a for into loop thought the anchors found using &lt;code&gt;frame.anchors&lt;/code&gt; to make a face anchor checking.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Yv4N583w--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4wzb5e5k138fewxilau8.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Yv4N583w--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4wzb5e5k138fewxilau8.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
&lt;em&gt;Here's an explanation&lt;/em&gt;&lt;br&gt;
&lt;a href="https://developer.apple.com/documentation/arkit/arfaceanchor"&gt;ARFaceAnchor&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Get Value of eyes movement: We'll use the blendShapes dictionary that represents the facial features recognized by ARKit. the value of each key on the dictionary is a  floating-point number indicating the current position of the feature and it ranges from 0.0 (neutral) to 1.0 (maximum movement).&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Finally, we will match the eye-opening and closing with the character's eye objects, scaling them on the z-axis.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--hEzbd2uC--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k9dfy3dl3sl2kwvogkrh.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--hEzbd2uC--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k9dfy3dl3sl2kwvogkrh.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;And we are officially done! Now you can run your application and share your Animoji :D&lt;/p&gt;

&lt;h5&gt;
  
  
  Demo Video
&lt;/h5&gt;

&lt;p&gt;&lt;a href="https://youtu.be/VDMJYfkbqZE"&gt;Youtube&lt;/a&gt;&lt;/p&gt;

&lt;h6&gt;
  
  
  useful resources
&lt;/h6&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://developer.apple.com/documentation/realitykit/creating_3d_content_with_reality_composer/configuring_elements_in_a_scene"&gt;set elements in scene&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://developer.apple.com/documentation/realitykit/creating_3d_content_with_reality_composer/manipulating_reality_composer_scenes_from_code"&gt;Manipulate objects from code&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://developer.apple.com/documentation/arkit/arfaceanchor/blendshapelocation/2928261-eyeblinkleft"&gt;eye blendingShapes&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>beginners</category>
      <category>ar</category>
      <category>swift</category>
      <category>animoji</category>
    </item>
    <item>
      <title> Why blogging is a great way to start a career in software development?</title>
      <dc:creator>Mariana Garnica</dc:creator>
      <pubDate>Sun, 14 Feb 2021 03:24:00 +0000</pubDate>
      <link>https://forem.com/garn0080/why-blogging-is-a-great-way-to-start-a-career-in-software-development-22pb</link>
      <guid>https://forem.com/garn0080/why-blogging-is-a-great-way-to-start-a-career-in-software-development-22pb</guid>
      <description>&lt;p&gt;&lt;em&gt;Photo by Lukas Blazek from Unsplash&lt;/em&gt; &lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--WbHroRA9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/wvpq5swr9lk0kdrw1a4r.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--WbHroRA9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/wvpq5swr9lk0kdrw1a4r.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Even though I'm a new blogger too, I consider that writing can bring many professional benefits for some of us that are just starting a career in the tech field. &lt;/p&gt;

&lt;p&gt;As students or new graduates, we face the challenge of getting a job that is related to our field and aligns with our professional aspirations. Sometimes because we lack professional experience or there is high competition in the area. Either way writing a blog can help us somehow to gain confidence and build a name for ourselves. &lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;Stand out from the competition&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Consider starting a blog on tech topics that matters to you and that might help others. When applying to jobs you'll catch the recruiter's attention easily giving them additional information about you, that demonstrates how self-motivated and different you are from other candidates.&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;Strength your knowledge&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Writing a post takes time and effort, which means that you'll need to plan and think about the topic you want to write about. The good side of it is that in the process you are reviewing and summarizing the information to make it understandable not only for others but for yourself. that's why writing, is a good way to strengthen your knowledge.&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;Networking&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Last but not least, is the ability that it gives you to connect with people. Some people can give you feedback or corrections on your blog posts, that would definitely make you a better professional and developer, and why not...you'll be able to get new friends in the industry.&lt;/p&gt;

&lt;p&gt;Hope you get encouraged to start your own blog and share your knowledge with others. Thanks for reading.&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>programming</category>
      <category>career</category>
    </item>
  </channel>
</rss>
