Inspiration

I love digital art and I've been a digital artist and animator for a few years now. I also love STEM, and want to major in Computer Engineering. My goal is too combine these two fields of study into one for my career. I decided I would create a website that allows users to make ASCII art while also learning how to use CSS, HTML, and JavaScript since I've never used them before.

What it does

The website takes an image from a user, analyzes the pixels on the images, and then turns into the desired ASCII art with settings from the user (i.e. if the ASCII should be inverted)

How we built it

First I created a design draft in Figma. Then, I built it using HTML, CSS, JavaScript, a bit of AI for when I got stuck.

Challenges we ran into

How to organize the above 3 coding languages, specifically HTML, so I could have webpage elements where I wanted them. I was struggling with this. I also had trouble with time, and only started the whole process for the website on the day of Hackathon. Not sure if I was supposed to start before of not, because the pressure of time was really weighing on me.

Accomplishments that we're proud of

I learned HTML, CSS, and JavaScript! (At least the basics of it). This is also my first ever website I built from the ground up so I'm very proud of myself, especially as a solo.

What we learned

I learned how to use the syntax for each language, how they work, and what they're used for. I also learned various commands such as animation in JavaScript for HTML.

What's next for Pixel2Ascii

I want to add more options, such as turning videos and text into ASCII. I also want to learn how to make it an accessible website you can access from just searching it up on the internet!

Built With

Share this project:

Updates

Submission history