Home Wiki Search Login Register

Welcome, Guest. Please login or register.
January 28, 2023, 09:56:27 pm
Forum activity rating: Four Star Posts: 56/24hrs Show Unread Posts | Unread Replies | Own Posts | Recent Posts
News: Art will save the world!

+  MelonLand Forum
|-+  Workshop Zone
| |-+  Showcase & Links
| | |-+  New professional site! (Loom.Cafe)
« previous next »
Pages: [1] Print
Author Topic: New professional site! (Loom.Cafe)  (Read 867 times)
Melooon
Administrator
Hero Member
*****
Posts: 939


So many stars!

SpaceHey: Friend Me!
StatusCafe: melon
iMood: Melonking
Itch.io: My Games

View Profile WWW
« on: July 30, 2022, 12:35:25 am »

I wanted to share my NEW professional site - Loom.Cafe (I really hope I still like that name in 6 months..)

*Disclaimer* While I don't always approve of professional sites being mixed into the web revival (I think it sucks away the fun) I do also recognise that many people including ME need professional sites and Id like to bridge that gap if I can.

First off I was blatantly inspired by cinni.net and was originally planning to do something more like it.. but things didn't go well, and after laying on the floor contemplating the horror of external insecurity of my own talents (as one does when a website is not going well) this idea to do a pure light and dark tunnel came to me.

I wanted it to be modern, but classic, but kinda cool 2000s design company-ish, but also simple and easy to manage. Most of all I wanted it to be honest to myself and to the ideals of the web revival, but also be something that didn't need explaining to a regular person.

Anyway, all things aside Im super pleased with how its turned out  ;D https://loom.cafe

Design Notes:

Essentially its key design feature is that its an iframe floating behind an SVG; there is a little bit of trickery with masking to make the text appear cutout; and its also not PERFECT.. for example you cant set any background other than a solid colour.. but maybe thats something that could be fixed with some sort of flexible svg? Im actually totally new to this whole svg thing!

Once its all setup and you have the fixed iframe and a few common css files to handle styling, its actually super fun to make mini pages like this; it makes my regular site feel like a major effort now! Sort of like an entire website webgarden? The smaller pages are much more forgiving than a full size page.

As for the circle! Ugh I just get sick all all the rectangles on the web sometimes; I know this is secretly still a rectangle, but I would like more orb centric websites! It adds some dead space around the edges, but its worth it.

ANYWAY #2, I hope some of you enjoy it, apologies its not another GifyPet or TextureTown, but sometimes a lil self representation is what the doctor ordered  \o/
« Last Edit: July 30, 2022, 09:27:16 pm by Melooon » Logged


everything lost will be recovered, when you drift into the arms of the undiscovered
I
Guest
« Reply #1 on: July 30, 2022, 04:53:40 am »

I like what you did with the iframe. Just put a big blank circle and put webpages under it! Very creative melon.
Logged
tarocchilla
Jr. Member
**
Posts: 53



SpaceHey: Friend Me!

View Profile WWW
« Reply #2 on: July 30, 2022, 10:30:56 am »

I like it a lot melon!
Manages to look professional without losing soul!;D I like that it has a lot of visual impact, and that i know who's behind it just by looking at it! wether circular or rectangular your websites have a really melon energy, i can see how much of yourself you put in them!


As for the circle! Ugh I just get sick all all the rectangles on the web sometimes; I know this is secretly still a rectangle, but I would like more orb centric websites! It adds some dead space around the edges, but its worth it.


I like the orb idea, i also saw a hexagon centric webpage:



I wish i could experiment with shapes like that more, but it requires quite a bit of technical skills!
Logged
TheFrugalGamer
Full Member
***
Posts: 102



Itch.io: My Games

View Profile WWW
« Reply #3 on: July 31, 2022, 12:16:03 am »

This is great! I love the design of course, but I also took the time to look through all the projects you've posted. I really enjoyed your graduate paper  :)
Logged

BradE
Newbie
*
Posts: 13


View Profile WWW
« Reply #4 on: July 31, 2022, 01:18:17 am »

I like it.  Not only is it well done but it is memorable which is exactly what you want.
Logged
wris
Jr. Member
**
Posts: 77


Safe when used as directed.

View Profile WWW
« Reply #5 on: July 31, 2022, 09:53:23 am »

That’s really cool! You’ve made me want to go play with masking techniques, now. Hmmm!

Also, I know what you mean about mixing professional stuff into web revival, but it also feels like a double edged sword.

“The professional web sucks, none of the websites have any sense of aesthetic style.”
“Okay, can I use this artistic style for my professional site?”
“absolutely not.”

I think the key is always just to do it with sincerity.

Logged
dantescanline
Newbie
*
Posts: 31


give em hell!

View Profile WWW
« Reply #6 on: August 03, 2022, 02:23:41 pm »

yooo that transparent masking of the contents beneath is JUICY!! circular websites are definitely the new fad after this drops
Logged

Melooon
Administrator
Hero Member
*****
Posts: 939


So many stars!

SpaceHey: Friend Me!
StatusCafe: melon
iMood: Melonking
Itch.io: My Games

View Profile WWW
« Reply #7 on: August 06, 2022, 08:59:27 pm »

Omgosh! I just noticed its totally broken on chrome and chrome-based browsers! Uggh I wish everyone would just delete chrome so i would not have to figure out how to fix this  :drat:

I'll post an update if I do work it out since its an interesting issue. As far as I can see masks.. or text in masks or.. text that folloows paths just does not work in chrome  :-\

EDIT:
OK so, Chrome does not fully support the latest SVG features: in particular it does not support SVG 2.0 that allows you to snap text to a <circle> instead of a dedicated <path> (what Im doing).. So the only fix is to replaced circles with paths.. but thats actually really complicated sooooooo. screw chrome users. you can see my site properly when your crappy browser gets updated :^P (Unless I change my mind..)

EDIT2:
Sigh. I fixed it! And yes it was a ridiculous process! I had to convert the circle to a path using this page. HOWEVER that path was inverted and there no way to un-invert it.. So you have to convert the path to an svg file using this site then import that svg file into Inkscape. Then click the path and do "Menubar/Path/Reverse", then export again as an svg, then open the svg in a text editor and copy the new reversed path coordinates, and paste them into your <path d="XXX"> on the webpage. AND NOW IT WORKS (after you correct the text start position...)
« Last Edit: August 07, 2022, 02:08:20 am by Melooon » Logged


everything lost will be recovered, when you drift into the arms of the undiscovered
/home/user/
Sr. Member
****
Posts: 389



StatusCafe: sprinkles
XMPP: Chat!

View Profile WWW
« Reply #8 on: August 06, 2022, 11:55:37 pm »

Omgosh! I just noticed its totally broken on chrome and chrome-based browsers! Uggh I wish everyone would just delete chrome so i would not have to figure out how to fix this  :drat:

I am happy that this implicitly confirms that none of us use a Chrome-based browser because noone mentioned that issue before. :4u:
Logged


Status Cafe Profile
Melooon
Administrator
Hero Member
*****
Posts: 939


So many stars!

SpaceHey: Friend Me!
StatusCafe: melon
iMood: Melonking
Itch.io: My Games

View Profile WWW
« Reply #9 on: August 07, 2022, 12:22:55 pm »

safari (not sure if it works there).

It was actually totally fine in Safari (I used safari to develop it), people say that Safari and Chrome use the same rendering engine, but I always seem to have TOTALLY different bugs between those two browsers.

But yeah, since it is a PROFESSIONAL site, I kinda needed it to actually work reliably for everyone :P In general though I don't worry about reliability and it sometimes bites me!
Logged


everything lost will be recovered, when you drift into the arms of the undiscovered
wris
Jr. Member
**
Posts: 77


Safe when used as directed.

View Profile WWW
« Reply #10 on: August 07, 2022, 05:57:14 pm »

people say that Safari and Chrome use the same rendering engine, but I always seem to have TOTALLY different bugs between those two browsers.

This hasn't been true for a while now. Safari uses WebKit, but Chrome forked WebKit and made Blink. Probably why you keep seeing differences. :)
Logged
/home/user/
Sr. Member
****
Posts: 389



StatusCafe: sprinkles
XMPP: Chat!

View Profile WWW
« Reply #11 on: August 07, 2022, 10:42:26 pm »

Can confirm that it works well in the text based browser Lynx. :pc:

Logged


Status Cafe Profile
Pages: [1] Print 
« previous next »
 

Melonking.Net © Always and ever was! SMF 2.0.19 | SMF © 2021, Simple Machines RSS | WAP2 | BBCode Help


MelonLand Badges and Other Melon Sites!

MelonLand Project! Visit the MelonLand Forum! Support the Forum
Visit Melonking.Net! Visit the Gif Gallery!