Archives for 2019

If, after a week, I’m already over my latest AdamCap.com redesign, does that count as progress? (Too soon? Not soon enough?)

I’ve launched redesigns in the past (to be enumerated below), and for each I’ve been privately optimistic that the “new wheels” would spurn creativity and drive and that I’d finally start consistently blogging for once, which I never have in the past, starting then, there, on launch. …Now. Any time. Soon. —I always feel the same deep-down-I-know-it-is-hollow optimism—the progression which follows is similar to that which ensues when you splurge on a product or service, thinking it will help engrain some positive habit or end, because with X in hand or at your disposal, “What you want will be so much easier to attain,” and for exactly one week or month, you are motivated, and it is easier to get yourself doing it, whatever it is—reading, losing weight, drinking water, writing—then the shiny new toy loses novelty, you forget about it, or get busy, and all that momentum abruptly decrescendos into a junk drawer and is eventually regifted to your indifferent (but courteous) “Yeah-OK-I’ll-Take-It” sibling or mom or the trash can.

In the case of my web redesigns, what I splurge is time. I put over a month of full-time work into this recent redesign. That is about how long it takes to make a good website. I did not make money during this time (working rate: $0/hour for approx. 197.5 hours from Dec–Jan), and not making money for that long may as well count as splurging money. I justify this cost because I figure during the process I will improve at web development, kick-start a business (or some kind of financial opportunity for myself), and make the money back later. But that is no shot fish in a barrel. And the real reason I ever redesign my blog is because I think if I have it configured “right,” that I’ll start writing more.

I’ve yet to reach “right.” It doesn’t exist. Writing is the hard part of this endeavor for me. I can code and manage a web property with some celerity. But producing content has always been slow, and tweaking stylesheets doesn’t make words flow any faster or more consistently. I’ve needed to write first, design later. The logical progression would be to make do until the habit is firmly established, then clear hindrances by obtaining resources. I’m acting backwards, again, because I am stubborn, but I did plan this redesign more thoughtfully than past ones (truly! [I swear! (really!)] ) which were inspired with mostly aesthetic (and not so many practical) ends in mind.

I’m going to describe a few of the atypical design elements in play for AC2019. (Which, really, I should not need to do, if the design is actually intuitive and good, but this process will (1) help me, at least, better understand what I was going for and (2) make blatant issues blatant, allowing me to address them.)

Design Elements

Three-Column Home Header

This is a convoluted, experimental, I-won’t-blame-you-if-you-call-it-dubious approach to a header that’s turned out to be…okay? (What?) To elucidate, column by column:

• Column 1: Navigation makes residence in C1, which, really, is an impractical position for navigation, because this situates it on the left side of the viewport, which may as well be mile away from the habitual cursor turf of a right-handed user. (Meaning: It’s a hassle to drag your mouse over there and give the menu use.) But I wanted to employ the underlined ADAM CAP “logo” (I use this term loosely) in the same position throughout the redesign (this is just the home header, remember; all other pages look different), and vertical nav makes efficient use the horizontal space afforded here. I get to include my beloved pixelated A icon in C1, too.
• Column 2: I desperately want to apprise users of new content, without making them scroll far (or at all), while providing them the ability to reference past content almost as effortlessly, and this is my solution. These three widgets show at-a-glance what’s new and allow old stuff to be seen/accessed by scrolling—no clicks necessary to become informed. This is one of the less intuitive aspects of the design. It’s rare to see overflow-y: scroll; elements (though overflow-x: scroll; is becoming commonplace with mobile devices having narrow screens). Even if the average user never discovers the scrollbars, the elements still serve their most crucial purpose (“Here lies activity!”).
• Column 3: I am not at the point yet where I have steady traffic, so it seems critical inform my few passersby whose lawn they’ve tromped on. My face has to be seen (blogs without a face are instantly forgettable [no sideways stares either; “Eye contact!”]) and I feel it’s wise to further cement myself with a goofy, succinct tagline. I’d prefer to include my newsletter signup than the current flat, insipid “hire me” pitch here (but I don’t have the newsletter’s raison d’être even remotely defined yet, and I do need $). This is the designated “call to action” spot, essentially. I’ll figure it out eventually.

This header functions better than anticipated, though it lacks focus. I was worried, in particular, that the C2 overflow-y elements be unusable on mobile, but they’re okay. (If something doesn’t work on mobile, then it doesn’t work at all; mobile users comprise an increasing percentage of the internet’s horde each month, and it’s imprudent not to tailor the web surfing experience to them.) Parts of the home header will inevitably be tweaked, but I’m at least not neurotically stressing out about needing to do so yet. (grits his fucking teeth)

Slanted, Canted, Offset, and Askew

This was a theme I incorporated sparingly (once) but prominently (in the header) in my last iteration of AdamCap.com. I brought transform: rotate(); over to SixPrizes for its 2017 redesign, and rotation pervades even more now. I considered myself brilliant and archetypal for incorporating canted elements then, but this appears to be a common design trend in 2019. I keep seeing it everywhere. Maybe it’s always been a trend and I’m just now realizing it. Regardless: Everyone else who’s canting their divs: Please stop. Give me this one opportunity to stick out and appear different and innovative for once. I mean it. (Thanks!)

I’ve not offset the positions of elements much in the past, but I made a deliberate effort to do so this time around. This technique helps add contrast, which makes individual elements more distinguishable and thus the site more navigable.

Anchors, Matey

I struggle with the decision to show (A) excerpts or (B) full content on archive pages. I prefer—usually—to see a full post if I hit the home page of a blog so that I don’t have to click (and then wait, again, for a page to load) to continue reading. Clicking is a decision, and work, and I don’t want to make decisions or do work. Please, take the wheel. Write well, and draw me in. Decide my fate for me. The less it takes to immerse a reader, the better.

However, when dealing with long-form content, which is what I tend to write, it’s a problem if the user encounters a topic they have zero interest in, and the entry is longer than a single viewport height. Scrolling past can feel like being stuck on a cyber treadmill, and the user will jump ship (leave my site) if they become overly disoriented or entangled. (Mayday! Mayday! Man overboard!) I lose my compass scrolling through the new AdamCap.com home page at times, and I am the sole author here. If anyone should be able to keep their bearings, it’s me. (An inauspicious sign this is, surely.)

My solution to this predicament was to add anchor links (these: ⇠ / ⇢) below post titles so that it’s possible to skip around, post by post, with infinitely higher velocity and precision. This is another unintuitive feature (even more so than the occult overflow-y above; I don’t know how anyone’s going to discover it), but the concept intrigues me and perhaps I’ll come up with a more effective implementation of it later.

Anchor links mesh cooly with my new M.O. because they (anchor links) provide instantaneous feedback. They’re fast. I really like the idea of loading a bunch of content (with a single page load) and letting a user zip through it all, in a deliberate way, and anchor links make that kind of interaction possible.

Sidebar Favs

What I am going for in the sidebar (to the right of posts) is to randomly display items from a curated list of my favorite things (you can buy on Amazon [to support me with scant affiliate commissions…]). What I’ve realized while typing this is that this idea (“favs!”) is boneheaded and unquestionably dubious because, even if I do see success with Amazon’s affiliate program, it places me at the mercy of Amazon. The big AZ. And that relationship has gone sour before. Amazon lowered their payout rates two years ago (in Mar 2017; my earnings dropped by over half the following month), and my Associates account was almost auto-terminated from the program the following year, out of the blue, erroneously. (Customer service resolved the glitch, but the incident certainly perturbed me.) It’s delusional to think I could come anywhere close to earning a stable, living income this way, and that has been my pie-in-the-sky hope here.

Instead, I should be promoting myself. I’m the commodity. And, from looking through past iterations of this website, it seems I’ve gotten away from doing that.

Past Designs

Nov ’09–Jan ’11

AdamCapriola.com (source)

web.archive.org

This is the earliest capture of any of my web entities from the Wayback Machine. AdamCapriola.com served to share me (my personality and personal interests), essentially. I had started SixPrizes.com a few months earlier and thought it was important to have an outlet (to come across as a relatable, real person) if I was to make it online. The images are broken, but I was evidently into relaying what I was wearing each day. I evidently had a “Fan Page” as well. Who knew.

There’s not much to say about the design. I used a theme called Atahualpa because it was easy to customize, and I read somewhere that red is attention grabbing, so I made the titles red.

AdamCap.com (source)

web.archive.org

AdamCap.com existed alongside AdamCapriola.com and contained content more rhetorical in nature. I think. (I am writing this ten years removed from the endeavor, and almost the entirety of it evades my memory.) The tagline reads “Thoughts on life, success, and human nature.” (Turns pale. [Dies.]) (Please ask Siri to dial 911 or shout for help if your eyes also roll clear into the back of your head and remain lodged there for 10+ seconds.)

Notably, I had a newsletter (no recall of what I spouted about—those archives were lost, tragically) and active comments sections, so I did some things right. But I should emphasize: the internet was different back then; this was a time of possibility for the little guy. The web had not become so big and centralized (and wearied and jaded) yet, and a small website like mine, with almost no substance but gumption, could attract a responsive audience.

Re: the design: The capture’s stylesheet is broken, but AdamCap.com was likely identical to AdamCapriola.com.

Jan ’11–Aug ’11

AdamCapriola.com (source)

web.archive.org

I added a third column and switched to excerpts. This looks okay to me; the design is clean, if nothing else. Logo font: Helsinki.

Aug ’11–May ’13

AdamCap.com (AdamCapriola.com Absorbed) (source)

web.archive.org

Above is what I have screen-captured in My Documents. Which looks great! It’s distinctive, at least, and exudes character. Opaque box-shadows still see use every now and then, most typically in retro-style designs. The red-bordered post titles are emphatic and I think serve well to draw the eye where it should be.

However, seen here is only a partial header. With the complete header, this design doesn’t look so hot:

The red–white–teal color scheme is a shade away from matching Aquafresh. That’s all I can think of when I look at this. ProTip: Toothpaste should not be evoked through web design. I was going for color contrast, but just no.

I could have done without the first row of the header; my name (Adam Capriola) was already above the fold (in the sidebar), and the recent tweet display (“GETTING GNAR OFF OVERLY-RIPE BANANAS #WASTEDDDDDDDDDDD – 3 DAYS AGO”), which feigned liveliness, was a cop-out for going long stretches without posting new content. (I should have been writing stuff for the blog instead of wasting breath [and brain cells] on social media.)

May ’13–Dec ’13

AdamCap.com (source)

web.archive.org

This was a short-lived design that I never completed for unremembered reasons. I launched it half-finished and it stayed that way. (Meow.)

Dec ’13–Feb ’16

AdamCap.com (source)

web.archive.org

I’m aghast that I let this design persist so long. It’s minimal to fault. It evinces none of my personality and is completely forgettable. Perhaps it speaks of my mental state through these years. The big feature here was the ability to sort by popular posts, which I doubt anyone did, except for me now and then to tug my own willy about how many views those popular posts had. Moving on…

Feb ’16–Jan ’19

AdamCap.com (source)

web.archive.org

AC2016 was designed for 1024px-wide viewports and none others. This screenshots shows the design at native size. With a viewport any wider or narrower, you’d have to zoom to read properly, so most initial impressions of my site were probably poor. It was a total mistake to not address this. (By 2016, even I, the wannabe Luddite who held onto his flip phone forever, owned a mobile device and could appreciate mobile-friendly design.) What happened is that I put 100% of my focus into the desktop design and I was too drained by the end of this process to even take a crack at mobile, so I put it off. And I never got to it. (Truth be told, I was lazy and addicted to video games at the time. Call me feeble.)

However, the combination of Abril Display (for H1), Freight Sans Pro (for H2–H6), and Freight Text Pro (for body) does look sharp. My face and name are unavoidable. And a handful of visitors were so captivated to email me. So there were elements that fell into place effectively.

2019–?

AdamCap.com

I’ve delved into the unique aspects of this design already, but one more thought: Perhaps the biggest fault with the current design is the lack of “me” above the fold on mobile and outside the home page—my physiognomy should pervade. (Remember me!) I’ve tried to remedy this by inserting my headshot into the header, but including it anywhere up there throws balance off. (I’m fixed on maintaining the conspicuity of the ADAM CAP logo / post title area which leads downward into the content.) So I’m leaving my mug out until better inspiration strikes. Otherwise, the 2019 design is responsive and generally more engaging than previous iterations.

Takeaways / Future Plans

Publishing (for me) and reading (for you) have to be easy. That’s the overarching impetus behind AC2019. I’m attempting to construct a platform that tips me over and has me spilling my brains out into shark-infested waters.

However, I am a slow writer. It feels like I’m rollerblading up a steep hill naked every time I try to share anything on here. The sun is in my eyes, and people are watching. It is difficult for me to spill. Which means: The platform I step onto doesn’t matter at this point. Any of the above designs would suffice now. I need to write—wherever, however, to whomever, in whatever. It’s consistency that needs to be built up. I’m hoping that with repetition the writing process will become easier.

I’d envisioned having delineated sections within this redesign for specific content types, some of whose content I’d enter database-style, with optional commentary (i.e., writing), so that it would be simple for me to keep the site active. Fill in a few fields, and bango: new post! Ta-da! Read all about it! In practice, it’s too much, in the obverse sense of my publishing woes. I’ve coded cruft. I generate noise. The result is mechanical and flat. “Cut the chaff,” as my grandmother Myrtle used to say while indexing a Newport. All anyone is trying to do is communicate, and this is a conversation.

I jot notes, physically, on paper, by hand, often, though I produce work predominantly through the abstraction of a computer screen. I’m notably less productive when I don’t scribble—even just a few words or fragmented incoherencies—over the course of a day. I tend to make sense of whatever faster when I scratch into matter, which isn’t quite replicated by way of the ephemeral processes of electronic journaling or noting. The act is akin to catapulting globs of stagnant, fetid goo out of the skull and onto stiff bedrock. “Here we are, thoughts: face to face. I see you, now, and you are demonstrably mine.”

We are cavemen at heart, after all, and it’s impertinent to constrain a spatial being. The keyboard is a straitjacket of sorts; it limits movement. Try to dismount. Try pirouetting away. It’s not easy. The right brain yearns to express at least slightly more than which it can computationally. (Kersplat!) So jot!

Tools of Trade

I choose to jot with pens, gel- and click-style, in particular, because they are effective and low maintenance. But there are many pens one could choose from. Too many, in fact: It’s perilously easy to lose oneself in the multitudinous aisles of online pen retailers (see: “timesuck”). I demoed about twenty pens the past couple of years because firsthand was the only way I could translate the practical scope of these objects in working contexts—and I advise readers to do the same. JetPens’ popular section (under $10) is a logical place to start. (ProTip: Use their filters.)

My formerly gross collection has been pared down to two pedestrian pens, in two categories, selected scrupulously for specific ends:

For Writing Quickly

The Pilot G2 (0.7mm) is my go-to in most circumstances. I write fastest legibly with this pen. Rapidity is mainly all I care about—fast, fast, fast; go and a minute ago. The pen doesn’t yield the most consistent lines, but I find the ink clear to read and the point satisfying to push/pull/yank across a page.

I write quickly with this pen because of how it’s balanced. I’m able to hold the pen in a way, with fulcrum (i.e., grip) distanced from the gel point, that allows minimal effort to write legible characters. The technique is similar to that of “choking down” on a baseball bat to swing with more force but less control. In this case, the ballpoint moves further with each gesture of the hand at the expense of precision.

I also use the 0.5mm G2, but in less instances, like when I’m scribbling notes while reading. Results from this pen tend to be sloppy; thinner points expose deficiencies in handwriting. I don’t particularly enjoy using the 0.5, but it’s the appropriate pen at times.

For Writing Neatly, in Small Spaces

I use a goofy, hybrid setup in these scenarios: I’m partial to the ink from the Uni-ball Signo 307 (Micro Point)—it’s grand!—but I abhor the Signo body. It’s thick and unwieldy, not unlike the jumbo crayons I scrawled with as a kid. And the clicker is a bore, no fun. But the ink!—it makes me want to attempt art. It flows smoothly and is consistently neat. I’m sure I could reproduce The Sleep of Reason… if I tried.

So: I attempted to transplant the Signo ink refill (while donning a surgical mask and scrubs) (“SCALPEL!”) into other pen bodies that I prefer, and found it’s compatible with the Zebra Sarasa Push Clip (any size). I really like the Zebra Clip. Its clip mechanism is novel and I think flat-out better than that of the average pen, whose mechanism is more susceptible to breaking and doesn’t engage with a pocket nearly as well. (I confess: I delight in clipping the Clip; I swoon when a marginally fussy, unthought task suddenly becomes a conscious cinch.)

Furthermore, the Clip is conducive to neat handwriting because there is little distance between the gel tip and where the pen is comfortable to grip in hand. It encourages the user to “choke up.” This gives way to higher precision than the G2, at the expense of speed. (Which makes sense: The faster one writes, the sloppier the handwriting. The Clip, by way of form, slows the hand down.)

Clip ink is okay—0.5mm I find to be best—but Signo ink is more reliable.

The most common use-case for me, for this Franken-pen, is addressing envelopes, which I don’t do all that often, truthfully. It sees sporadic use, now, though I wrote with it more in the past.

Uni-ball Signo 307 (Medium Point) ink is also compatible with the Clip body, but I almost always prefer to write quickly than neatly at 0.7mm size, so I seldom operate this combo.

Hastily, On Paper

When structure seems apposite, I write on cheap, yellow legal pads. Otherwise, I jot on plain, unlined computer paper (lightweight stock, high brightness, e.g., 20lb / 96 bright) to afford my thoughts abandon.

And Where to Buy

I’ve included product links above that point to Amazon. I get a small kickback if you purchase from them, which allows me to continue producing this type of content. But: The Pilot and Uni-ball can be found for the lowest price at Walmart. That’s where I buy them. The Zebra Clip is only available online (and at specialty stores, I assume); JetPens had the best price on the Clip, last I checked.