UI / UX Design.

Webs and Apps developments

KRISHNA VR

Design and web development of a webpage for Krishna Vr a mexican photographer. This page was bulit from the scratch withHTML, CSS and JavaScript.
GitHub: https://github.com/MarianaAleman/KrishnaVr

TRIVIA GAME

GitHub: https://github.com/MarianaAleman/TriviaGame

A company has come to you as a developer and asked you to develop a mobile application that will work onmultiple platforms as the front end for their back-end API which is the base for trivia games. They know it isa very difficult task to install all the different libraries and SDKs to do this, so they have told you that using aCloud based compiling tool is the best option.To be able to access the trivia questions and answers, you will need to connect to their external API.Specific Requirements• The application should have a welcome screen that displays the current date and time.
• The application should request a list of questions and answers from the API provided(https://opentdb.com/).
• All the data that is collected should be parsed to extract content. Raw JSON should not be printedto the user.• Once the application receives the questions and answers from the API, it should display thequestions one by one along with the for possible answers provided. The user then should be able toselect one of the answers.
• If the user selects the correct answer, a congratulation message should pop up. If the user selects awrong answer, the application should indicate what the correct answer was. In both cases, theapplication should continue to display the next question and options.
• Whenever any JSON service is queried, all the data should be stored locally inside of an array whichwill later be used to present the questions and possible answers to the user. This reduces thenumber of requests which are made on the services.
• There must be a score system. For every correct answer the user will receive 10 points, and forevery incorrect answer the user will receive -5 points. The total amount of points the user hasshould be stored locally, either using a file system, or a local database.

GPS SENSOR & GOOGLE MAPS API

We were given the challenge of developing a mobile program that works with theGPS sensor and Google Map API, from which it was decided to offer this system withthe main intention of helping people who work in several different places in the same dayto get around easily and in an organized way.
The entire project was developed in macOS BigSur and Windows 10machines. The technology used to code an App for android devices wasNode.js, an open-source, back-end JavaScript runtime environment that runson various platforms and executes JavaScript code. And Expo, a framework anda platform for universal React applications. It is a set of tools and services based on React Native and native platforms that allow you to design, build, deploy oniOS, Android apps using the same JavaScript/TypeScript codebase. (ExpoDocumentation, 2021).
Software Visual Studio Code was used to make the code, and GitHubrepository to save and share the project with the team. The schedule and workplan and meetings were carried out by Zoom meet, in accordance with COVID19 security guidelines. Microsoft Word and Powerpoint were utilized for thedocumentation and presentation of this project.
Expo is a tool used in React Native app development to get to thedevice's native APIs without modifying native code. It also includes an app forAndroid/iOS that contains all of the native code required by React Native tolaunch the app. That is, the SDKs for Android and iOS do not need to be installedseparately. As a result, the only code change is in Javascript.
The app is made up of React Native, Expo SDK, and third-party libraries,according to Expo Documentation. To use React Native's core components andAPIs it is necessary to select a version of the library that is compatible with theproject and then install the dependencies using a JavaScript package manager,such as npm.Project code should import the library to access the components; forexample, import React from 'react'.
Some libraries were utilized in the WorkersTrack App to provide the needed functionality.This project made use of the react-native-maps library API, which offersa map component that utilizes Apple or Google Maps on iOS and Android. TheMapView (figure 2) component API allows map features (markers, callouts,and polylines) to be utilized as MapView children. These components wereused to show the map and mark the coordinates. The MapViewDirections(react-native-maps-directions) function draws a path between two locations.
Other projects: