Hi my name is Ariel, just like the little mermaid! This is my web developer portfolio! I have been a developer for some years working mostly with front-end, meaning “I like to make your site look pretty”. Throughout my development journey I’ve took a path of creating websites via CMS such as WordPress. I love subtle animations and engaging users when they come to a website I’ve built. When I am not making cool things I like to play basketball, eat tacos and pizza, and trying not to blow my fantasy football season away.
Here is a page I made for Barkly that was cool to make. The panels look really cool when you hover over them. This really scratched my itch for doing really subtle animations.
One of my first tasks for Barkly was to created an animation within the iPhone on their home page. The challenging part was the frame of the iPhone was a background image and the screens were 4 different images displayed through html. I ended up stacking the screen image and calculated how they should be displayed with a css keyframe animation.
The “How it Works” page is one of my favorite pages I created for Barkly Pets. The left and right design inspired me to do a scroll animation. I love making animations so it was a really fun page to create.
One of my tasks with Barkly Pets was to migrate their Medium blog to WordPress for SEO purposes. Starting from not knowing WordPress to building this blog was an incredible transition. I learned how to include partials and working with complex loops. I also made a partial by looping through the most recent posts to display them nicely in the home page in order to navigate users to the blog.
During my time with Barkly Pets I created a neighborhood template within WordPress and PHP. This was to help with SEO related to the neighborhoods Barkly Pets walked dogs in. I looped through the neighborhoods in each city to filter out the data. I also included “Related Neighborhoods” within the template, which filtered out the neighborhoods in close proximity. Filtering through the related neighborhoods was challenging but I learned a lot about looping in WordPress!
This project I added to existing code to add another switch button so that the graph displays the price differentials in New York and in other cities. This was with simple HTML, CSS and JS.
Taking the data from Facebook I displayed Barkly’s reviews and used a slider plugin to easily have the user run through all of the reviews. I learned how to used JSON with PHP and decoding and encoding methods that PHP uses. I also filtered the reviews by displaying only 5 star reviews that contained text.
I learned a whole lot about localStorage implementing this popup. I used localStorage in JS to track if a user has been on the blog site before. If they have not and also have not signed up they will see the popup when scrolling down to the end of the blog. If they come back to the site and have not been there for 12 hours they will see the popup again when scrolling to the bottom. This way, the user doesn’t constantly get annoyed by the popup but is able to see it enough to gain influence for them to sign up.
This project was picked midway through. Some of the work had been done but was not completed by the previous developer. The original work was done with Craft CMS but was transferred to WordPress and I continued to transfer the site with WordPress and using the pods plugins for some of the items.
This landing page was made at my full time job at Silverback Strategies. The creative team at Silverback had a great idea for an interactive landing page that I was able to implement by using React.js along with the WordPress API. I was able to make the page seamless for the user through React and grabbing the back end data with an API call in JavaScript. I not only made something that looks so cool but also learned how to use the WordPress API and really dive into React with a whole new project like I have been wanting to.
This website is one of the most customizable site I have been a part of. It came with a lot of collaboration with another amazing developer and designer. The other developer had an extensive task of creating the eCommerce side of this site using WooCommerce. The designer made awesome mockups that I had the honor of creating. All content on the site from copy to images can be updated by the client with minimal amount of WordPress plugins. This was a great learning experience from start to finish and I was glad to be a part of it!
I love this site for its very simple color scheme that somehow relates to the industry this company is in. This site was made with WordPress and using SCSS instead of CSS. Although a lot has changed about it since it was handed to the client, its beautiful to me. My favorite thing about this site is the homepage on mobile. We needed a way to have imagery with text over it but I added my own animations. While the user scrolls down over the section with imagery from a particular category, additional text slides in. I love messing around with JavaScript and CSS to create cool animations.
I have to give credit to the designer I worked with on this. Such a beautiful design. This was a challenge since there were a lot of overlapping items in the design, so combining that with making it as customizable as possible for the client once we handed it over made me have to think through how each section should be done. All in all, it came out great and even one an award!
This project was new for me as it was an e-commerce site with Shopify in the backend so the client can have an easier time managing their store. We used WPShopify for the frontend. Essentially it connected their Shopify store to their WordPress site, then built out the front-end with a page builder.
Working with Gutenberg on this project was a blast. I made a lot of custom sections that are re-usable throughout the sites. I also helped run their campaigns through Klaviyo.
In my time as a web developer I have worked for several companies where I have gained experience with frontend languages. I have worked with a lot of HTML, CSS, LESS/Sass, Tailwind, JavaScript, Laravel, Inertia.js and Vue.js. I've also gained a lot of knowledge of Node and different package managers through my work experiences.
I've learned most languages by doing as I think anyone else would, but my favorite projects were built in Laravel, Inertia, and Vue. It taught me a lot about back-end development and structuring databases in order to easily pull from the front-end.
During my time at Mindsize I worked heavily with WordPress and Shopify, being the lead developer on two projects the first year. I ensured front-end updates were completed, tested and deployed whether I was coding them out or not. I improved processes and created documentation for future developers to easily hop on the project. I then started working heavily with Laravel, Inertia.js and Vue.js on a web application. This taught me a lot about mySQL, structuring a DB to best fit pulling from the front-end and also Vue, which I fell in love with! I fell in love with using that stack enough to start building my own web app which I hope to finish by then end of the month (as I write this in October of 2022)
Working at Silverback Strategies has been great thus far. I have worked with several clients on maintaining their websites that are built on different content management systems. Also, building websites from scratch with WordPress has been amazing. I have made sites that are easily customizable to those who are not technically savvy.
As a Front End Developer at Barkly Pets I have worked with a lot of new things. Gained an extensive knowledge in PHP. Working at a startup I have really helped to be a part of a team to bring the business to better place. This included, migrating the site to Wordpress, updating the pages for a better and more modern appearance, adding UI elements, and incorporating SEO tactics in order to show up at the top of search engines organically. Not only did I learn more about Software Engineering, but I also learned a lot about design and even ceated mockups on Adobe Illustrator.
At TrueChoice Solutions I worked with a lot of UI elements as well as building applications through an in-house process. Several other duties included: Build client applications within due dates. Update client applications based on feedback. Create brand new dynamic templates within the platform for reuse in client applications. Work with HTML5, CSS3, JavaScript, LESS, Gulp, and Angular to create new functionality. Set standard organizations for client releases in order to provide a more efficient release process. Set a standard HTML email template for clients.
Developing web apps and gaining knowledge of different languages. Worked with the following languages: HTML, CSS, JavaScript, J Query, Angular.js
In this course I really started to dive deep into web development instead of teaching myself. I gained a lot of knowledge on HTML CSS and the basics of JavaScript in order to build the foundations needed to create some great UI. I built a portfolio and was at the top of my class.
Bachelor's Degree in Psychology, President of the Psychology Club, Captain of the Women's Basketball Team.