You are browsing as a guest. Sign up (or log in) to start making projects!

website

  • 7 Devlogs
  • 69 Total hours

coding my mom and i's art website!

Super Star

As a prize for your great work, look out for a bonus prize in the mail :)

Ship #1

I created a website to promote my mother and I’s creative projects, and the book we made. As someone with limited coding experience, especially in website building, starting this project off was quite a learning curve and often felt overwhelming/frustrating. However, I’m glad I stayed with it, because I feel a lot more comfortable with my coding capabilities AND I have my very own website! I am still getting the hang of website building, but I think this turned out good for a first time project!

  • 7 devlogs
  • 69h
  • 16.31x multiplier
  • 666 Stardust
Try project → See source code →
Open comments for this post

3h 35m 46s logged

dev log #7

exciting news!! the website its basically done ^_^!!

updates:

  • finished the current projects page, played around with formatting
  • minor adjustments to other pages for consistency and little tweaks
  • finished store page: well, to be fair the store won’t really exist for a while until i publish my website and can link insite payments…. but the scaffold with a few example display products are there!
  • finished about page: the about page is finished, though i might change some of the css styling because there’s some thigns im not in love with
  • adjusted to smaller screen sizes i went through and fixed all the pages so they can now be viewed ona mobile screen! idk how it looks on an ipad screen though… that might still need some work

overall, the website is just about ready to be published! its just down to making small revisions, checking over for any bugs, and final adjustments!

im hoping to ship it by next devlog!! yay!

0
0
15
Open comments for this post

3h 18m 57s logged

dev log #6 (but its actually the 6th one this time

my last dev log was my 5th– ignore my brain fart >^<

anyways—– exciting update! the current projects page is finished now!

heres what i updated:
-finished the three article sections: these are the little sections that introduce/focus on each of my current projects– they’re what the whole page is about
-i also decided to play around with a different style/layout for this section to help me get more comfortable and stronger with using css to make different format/section styles

next steps
-start and finish the about page and revamp the store page
-format the entire website for mobile screen (oh god)

BUT we are seeing the light at the end of the tunnel!
i’m hoping to ship the project soon!

0
0
8
Open comments for this post

5h 7m 14s logged

dev log #6!!!

hi guys! sorry for the brief pause. i just havent had much time to code recently so this will be a smaller update.

art lessons page: the art lessons page has finally been completed!
new features—––

  • finished the supplies lists for each kind of lesson- now each lesson has a specific list of materials w/images/directing links to make finding suggested supplies easier!
  • i also reused the code from the comissions FAQ section to create an FAQ section for the art lessons page <3
  • lastly, i created a new contact form specifically for requesting art lessons!

current projects page: i am now working on the current projects page!!!

  • i want this page to sort of be like a bunch of seperate articles/sections that show the current art projects i’m working on
  • i began working on the first article section thing, which details the painting im working on, but there is still a lot of formatitng changes i want to make
  • i’m thinking about whether i should keep it more text heavy, like a traditional article, or keep the images and little slide thingies
    -tbh i hate writing but i feel like it would be more polished with more of an article format TwT
0
0
63
Open comments for this post

5h 50m 24s logged

dev log #4 :DDD

I’m going to do my best to continue be more comprehensive here.

Homepage updates

  • added a book preview element:
    • thanks to a youtube tutorial by hankthetank, I was able to create a small preview that shows some of the books pages
  • what makes this element so cool (in my opinion) is the animation, which mimics a real turning page
    (you could say its a real page turner hahaha im so funny)
  • huge credits to www.turnjs.com for the js code that made this possible!
    • removed iframes *: as much as the iframes on the home page were fun, i don’t think they really made it easy to go the website and purchase the book, especially since they were aligned on the page more decoratively then utility minded…
    • instead, i replaced them with simply embedding links into the text. this felt more straightforward and made more sense, even tho iframes are fun

art lesson page updates

  • created form to sign up for art lessons
  • finished small bio section/lesson info
  • i am now working on finishing the needed materials section, which is so tedious because i want to link every product/material to make it easier to find them

anyways, thats all for now!

1
0
11
Open comments for this post

22h 23m 53s logged

Dev Log (^w^)

It’s been… a while since my last update, so here’s a big catch-up! I’m trying to document everything properly from now on instead of relying on my goldfish memory.


Homepage Updates

Glassmorphism

  • Added reusable glassmorphism cards.
  • Replaced a plain gray border with a gradient pseudo-element for more depth.
  • Credit to the Hype4 Glassmorphism Generator for the base effect.

Animations

  • Added floating stars to make the homepage feel more alive.
  • Implemented scroll reveal animations so sections appear as users scroll.
  • Created a reusable .swing class using CSS keyframes for playful hover animations.

Hover Effects

Added several interactions to make the site feel less static:

  • Growing navigation buttons
  • Lifting image cards
  • 3D tilt effects
  • Wobbling hanging images
  • Animated logos

Art Page

Created a dedicated Art page that serves as a navigation hub.

Current features:

  • Navigation bar
  • “Ela’s Art Emporium” logo
  • AP Art portfolio showcase

Eventually I’d like to add preview sections for the other art pages.


Art Lessons Page

Started building the Art Lessons page.

Current features:

  • About Me section
  • Lesson preview cards
  • Images and descriptions
  • Consistent card styling
  • Hover animations

Still a WIP, but I’m really happy with the direction it’s going.


Commission Page

This has become one of the biggest pages on the website.

Features include:

  • Accordion timeline explaining the commission process
  • Pricing section
  • Interactive commission builder that generates price estimates
  • FAQ accordion

The commission builder was definitely the hardest feature I’ve coded so far, but also one of my favorites.


Art Gallery

Created a gallery using polaroid-style flip cards.

Since every painting has different dimensions, I added a full image viewer so users can see artwork at its original size. I may replace the buttons with a click-to-expand feature later to reduce clutter.


Next Steps

  • Finish the Art Lessons page
  • Create the Current Projects page
  • Finish the About page
  • Finish the Store page
  • Make the website fully mobile-friendly (task of doom and despair…)
0
0
3
Open comments for this post

25h 27m 25s logged

Okay I cant lie I slacked off on updating my dev log for like way too long oops! but we made a lot of progress!!! First of all, I finished the home page!! Yay!! I added a nav bar to the other pages (which aren’t yet finished) interactive elements liek slideshows, and other fun little sections. I am honestly loving the progress that is happening its come a long way for sure. There was a pretty steep learning curve at the beginning but now like 200 video tutorial later I finally feel like I know what im doing. Lets gooooo

0
0
4

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…