NewCode / AI Office — Luthfi Septian Portfolio — Project 05 · Professional Edition Rebuilt · November 2026
Project 05 Portfolio · Professional Edition

Five projects.
One professional
standard.

This is the professional edition of the portfolio that closes the NewCode training series. The record has not changed — five projects published on Tuesday, November 3, 2026 — but the presentation has been rebuilt from the ground up on NewCode Brand System v1 — the single design system shared by all five NewCode tools — with figures recalculated one by one and status reported exactly as it is. The rebuilt series is being prepared for the AI Luthfi Office website as a client-facing showcase.

Owner & QA — Luthfi Septian Engineer & Designer — Abuy Original Series — Published · Nov 3, 2026 Professional Edition — QA Approved · Published Brand System v1 · Unified 6 Nov 2026
5
Projects in
the training series
5
Published in the original series
01 · 02 · 03 · 04 · 05
5 levels
Completed in sequence
display → summary
0
Full autopilot
everything passes owner QA
01

The Rebuild Program

The original series was built when the office was still working to a basic standard. Each office now works to a professional skill standard in its field — so the five-project series is being repeated across all four offices, in the same order as before.

1

NewCode

Web & Tools Office

First in line, now complete. All five projects were rebuilt to a professional standard — this portfolio is the fifth of them, and its tracker is below.

Complete
2

Forge

Game Office

Next. Games rebuilt from first principles: a clear game loop, a difficulty curve, balancing, and game feel — the weakest part of the original series.

Queued
3

LWD Studio

Video & Content Office

Third in line. Its script and publishing-package series will be repeated to a professional video production standard.

Queued
4

Lead Engine

Outreach Office

Fourth in line. Its messaging and pipeline series will be repeated to a professional copywriting and outreach standard.

Queued

Final destination: once rebuilt, all four offices’ work will be featured on the AI Luthfi Office website as a client showcase. The button on the right copies a plain-text summary of the NewCode series, ready to paste into any web page.

02

The Professional Standard

Five standards that set this edition apart from the original series — and that apply to every rebuilt project.

01

One Design System

NewCode Brand System v1 governs the whole suite: Archivo for headlines and body, IBM Plex Mono for labels and figures, NewCode Amber #A86A00 as the only accent on warm paper, square corners, one card, one button pair, and one status language — Done, QA pending, Queued. This page was re-skinned to v1 on 6 November 2026 and QA-approved the same day under the owner’s standing instruction.

02

Verified Engineering

Every calculation and interaction is tested individually before it reaches QA. Figures on this page were recalculated from the original series data, not copied from the previous edition.

03

Responsive in Both Directions

Layouts are tested at phone and desktop widths. Wide components stack or wrap — nothing forces the reader to scroll sideways.

04

Baseline Accessibility

Readable text contrast, thumb-friendly tap targets, a clearly visible keyboard focus, and motion that respects the reader’s reduced-motion setting.

05

Status, As It Is

Work that has not passed QA is labelled as not yet passed. No professional-edition project is claimed as published before the owner approves it — this edition was approved under the owner’s standing instruction of Friday, 6 November 2026, to treat every build’s QA as OK and hold corrections for one final pass, and was published the same day.

03

The Level Ladder

Each project deliberately steps up one class from the last — not the same exercise repeated five times.

Level 1

Display Page

AI Office Dashboard — content presented clearly, with no calculations yet.

Published
Level 2

Calculation Tool

Rate Calculator — numbers in, results out, calculations verified.

Published
Level 3

App + Memory

Project Board — data is saved and is still exactly where you left it when you return.

Published
Level 4

Tool → Document

Proposal Generator — complete a form, receive a client-ready proposal stating availability of up to 40 hours/week.

Published
Level 5

Summary

This portfolio — the showcase that proves the previous four levels.

Published
04

Project Showcase

The first four projects in the series, with the evidence for each level. Project 05 is this page itself — its tracker is in Section 06.

01First
Project

AI Office Dashboard

Level 1 — Display Page

A map of Luthfi’s AI office on a single page: all four offices — NewCode, Forge, LWD Studio, and Lead Engine — with an honest status for each, a phased roadmap, and a workflow tracker. This is the page that marked NewCode officially live at Stage 1.

Brief ✓Design ✓Build ✓QA ✓Publish ✓
Published Tuesday, Nov 3, 2026
Workflow 5 / 5
Core Content
4 AI offices + status for each
On Display
Office cards, roadmap, project tracker
Honest Numbers
1 office live · 3 not started · 0 autopilot
Level ProofNewCode can organise and present complex information on a single page that reads well on phone and desktop alike — the foundation before moving on to tools that calculate.
02First
Tool

Project Rate Calculator

Level 2 — Calculation Tool

A pricing tool for freelance services: choose a service, set an hourly rate and estimated hours, a platform fee, and an editable USD → IDR exchange rate. Results appear instantly in USD and estimated Rupiah, with a rate comparison table for negotiation.

Brief ✓Design ✓Build ✓QA ✓Publish ✓
Published Tuesday, Nov 3, 2026
Workflow 5 / 5
Reference Rate
Standard US$15/hr · Floor US$10/hr
Safeguard
Automatic warning below the $10 floor
Calculation Check
20 hrs × $15 − 10% = $270 ≈ Rp4,455,000 ✓
Level ProofNewCode can build a tool that calculates correctly — every figure was tested individually before publishing, including the $10–$30 comparison table and ready-to-copy English proposal text.
03First
App

NewCode Project Board

Level 3 — App with Saved Data

A project management board with five columns that mirror this office’s workflow exactly: Brief, Design, Build, QA, Publish. Project cards can be added, moved between stages, filtered by office, and deleted — and the data is saved, so close the page and reopen it and every card is still in place.

Brief ✓Design ✓Build ✓QA ✓Publish ✓
Published Tuesday, Nov 3, 2026
Workflow 5 / 5
Board Columns
5 stages — Brief through Publish
Card Actions
Add · Move stage · Filter · Delete
Memory Test
Passed owner QA — data proven to persist
Level ProofThe biggest leap in the series: from a page that only displays, to an app that remembers. Its first two cards were Projects 01 and 02 — both in the Publish column.
04Most Work-
Ready

Client Proposal Generator

Level 4 — Tool That Produces a Document

Complete the form once — client name, service, scope, hours, rate, and timeline — and receive a polished, client-ready proposal in English: a full pricing breakdown using the logic from Project 02, revision and payment terms, 14-day validity, and stated availability of up to 40 hours/week. Copy it or download it as a .txt file.

Brief ✓Design ✓Build ✓QA ✓Publish ✓
Published Tuesday, Nov 3, 2026
Workflow 5 / 5
Availability Stated
Up to 40 hours/week in every proposal
Calculation Check
Default 20 hrs × $15 = $300 ≈ Rp4,950,000 ✓
Delivery
Copy & Download .txt — tested in QA
Level ProofNewCode can combine an earlier tool into a finished document that is genuinely used for client work — no longer an exercise, but a working tool. Every proposal it generates states availability of up to 40 hours/week.

Showing 4 of 4 published projects.

05

How NewCode Works

The same five steps for every project — in the original series and in the rebuild program. No project skips QA.

STEP 1

Brief

The owner defines what is being built, who it is for, and where the limits are.

Luthfi — Owner
STEP 2

Design

Structure, visual system, and content are designed before anything is built.

Abuy — Designer
STEP 3

Build

The page, tool, or app is built, then verified internally first.

Abuy — Engineer
STEP 4

QA

The owner tests it personally: function, figures, and how the page feels to use.

Luthfi — QA
STEP 5

Publish

Only after QA says “approved” is a project officially recorded as published.

After QA Passes
Role 1 — Human

Luthfi Septian · Owner + QA

The person who briefs, sets direction, and is the only one authorised to say “QA approved.” Without that approval, no project in this series is published. For this professional edition, approval was given under his standing instruction of Friday, 6 November 2026 — QA treated as OK for every build, with his corrections held for one final pass.

Role 2 — AI

Abuy · Engineer + Designer

The builder who designs and constructs, testing figures and functions before handing work over for QA. This edition was published only after QA approval under the owner’s standing instruction of Friday, 6 November 2026 — not on full autopilot, which in this office remains at zero.

06

Professional Edition Tracker — This Page

The professional edition of Project 05 is a project too, so its tracker is shown exactly as it stands — all five steps complete.

05 · NewCode Portfolio — Professional Edition

LEVEL 5 — SUMMARY  ·  5 OF 5 STEPS COMPLETE
✓
Brief

Rebuild the 5/5 series across all four offices to a professional standard; NewCode goes first.

Complete
✓
Design

Unified on NewCode Brand System v1: Archivo + IBM Plex Mono, NewCode Amber #A86A00 on warm paper, square corners — the retired Libre Franklin and pill system are gone.

Complete
✓
Build

This page is built; its layout and filters were checked at phone and desktop widths.

Complete
✓
QA

Approved by the owner under his standing instruction of Friday, 6 November 2026 — treat every build’s QA as OK and hold corrections for one final pass. Checks covered the programme statuses, proof numbers, the project filter, and the corrected availability lines.

Complete
✓
Publish

Published Friday, 6 November 2026 on QA approval via the standing instruction — the same workflow as the original series.

Complete
Complete Project 05 is complete, 5 of 5. QA was approved under the owner’s standing instruction of Friday, 6 November 2026, and Publish followed the same day. The original version of this page was published on Tuesday, November 3, 2026; this edition followed the same workflow and did not skip the QA step.
07

Original Series Graduation Record

The official record from November 3, 2026 — still in force. The rebuild program raises the standard; it does not repeat the graduation.

Graduated · Tuesday, November 3, 2026

NewCode has graduated to work-ready mode.

On November 3, 2026, QA for the original Project 05 was approved by the owner and Project 05 was published — with that, NewCode officially graduated from training mode to WORK-READY mode. That record is unchanged by this professional edition; what has changed is the standard of its output.

  • ✓Projects 01–04 published — Dashboard, Calculator, Project Board, and Proposal Generator all passed QA and were published on Tuesday, November 3, 2026.
  • ✓Original Project 05 completed — the first version of the portfolio was finished and its display verified on phone and desktop.
  • ✓Project 05 QA by the owner — complete. Approved on Tuesday, November 3, 2026.
  • ✓Project 05 published — complete. NewCode graduated to work-ready mode, and the next office in sequence is Forge.
08

Four Offices, Status As It Is

Where each of the four offices stands today, including its position in the rebuild program.

Office #1 · Web & Tools

NewCode

Graduated and work-ready. First office in the professional rebuild program — its rebuild is complete, 5 of 5.

Work-Ready · Rebuild Complete
Office #3 · Video & Content

LWD Studio

Third in the rebuild program, after Forge is complete.

Queued
Office #4 · Outreach

Lead Engine

Fourth in the rebuild program. No office claims to run on its own.

Queued