Iván Eduardo Chavez Ayub
1257 lines
38 KiB
HTML
1257 lines
38 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>Warlock-Studio — AI Upscale & Restoration Platform</title>
|
||
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||
<link
|
||
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&family=Oswald:wght@400;700&display=swap"
|
||
rel="stylesheet"
|
||
/>
|
||
|
||
<meta
|
||
name="description"
|
||
content="Warlock-Studio — High-performance unified platform for AI upscaling, restoration, denoising and frame interpolation."
|
||
/>
|
||
|
||
<style>
|
||
/* ============================================================
|
||
WARLOCK-STUDIO — Banner Theme (Red, Gold, Silver)
|
||
============================================================ */
|
||
|
||
/* === Color & Font Variables === */
|
||
:root {
|
||
--bg: #111111;
|
||
--panel: #1c1c1c;
|
||
--text: #e0e0e0; /* Silver from "Studio" */
|
||
--muted: #a0a0a0;
|
||
--gold: #ffd700; /* Gold from logo */
|
||
--gold-light: #f0e68c;
|
||
--red: #b31b1b; /* Red from "Warlock" */
|
||
--silver: #d0d0d0; /* Silver from "Studio" */
|
||
--border: rgba(255, 255, 255, 0.08);
|
||
--shadow: 0 10px 35px rgba(0, 0, 0, 0.75);
|
||
--glass: rgba(255, 255, 255, 0.02);
|
||
--glow: 0 0 14px rgba(255, 215, 0, 0.25);
|
||
--font-ui: "Roboto", system-ui, sans-serif;
|
||
--font-headings: "Oswald", sans-serif;
|
||
--max-width: 1200px;
|
||
}
|
||
|
||
/* === Global Reset === */
|
||
* {
|
||
box-sizing: border-box;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
html {
|
||
scroll-behavior: smooth;
|
||
}
|
||
body {
|
||
background: var(--bg);
|
||
color: var(--text);
|
||
font-family: var(--font-ui);
|
||
line-height: 1.65;
|
||
-webkit-font-smoothing: antialiased;
|
||
overflow-x: hidden;
|
||
}
|
||
|
||
/* === Header === */
|
||
header.site-header {
|
||
position: sticky;
|
||
top: 0;
|
||
z-index: 1000;
|
||
background: rgba(17, 17, 17, 0.8); /* Darker bg */
|
||
backdrop-filter: blur(8px);
|
||
border-bottom: 1px solid var(--border);
|
||
}
|
||
|
||
.nav-inner {
|
||
max-width: var(--max-width);
|
||
margin: 0 auto;
|
||
padding: 0.8rem 1rem;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 1rem;
|
||
}
|
||
|
||
.brand {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1rem;
|
||
text-decoration: none;
|
||
}
|
||
|
||
.brand .title {
|
||
font-family: var(--font-headings);
|
||
letter-spacing: 1px;
|
||
font-weight: 700;
|
||
font-size: 1.5rem; /* Larger */
|
||
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
|
||
color: var(--red); /* "Warlock" color */
|
||
}
|
||
.brand .title span {
|
||
color: var(--silver); /* "Studio" color */
|
||
}
|
||
|
||
/* === Navigation === */
|
||
nav.primary-nav {
|
||
display: flex;
|
||
gap: 0.5rem;
|
||
}
|
||
nav.primary-nav a {
|
||
color: var(--muted);
|
||
font-family: var(--font-headings);
|
||
font-weight: 400; /* Oswald 400 */
|
||
font-size: 1rem;
|
||
text-decoration: none;
|
||
padding: 0.5rem 0.7rem;
|
||
border-radius: 8px;
|
||
transition: all 220ms ease;
|
||
text-transform: uppercase;
|
||
}
|
||
nav.primary-nav a:hover {
|
||
color: var(--gold);
|
||
background: var(--glass);
|
||
transform: translateY(-2px);
|
||
}
|
||
|
||
/* === Mobile Menu === */
|
||
.hamburger {
|
||
display: none;
|
||
width: 42px;
|
||
height: 42px;
|
||
border-radius: 8px;
|
||
background: var(--glass);
|
||
border: 1px solid var(--border);
|
||
align-items: center;
|
||
justify-content: center;
|
||
cursor: pointer;
|
||
}
|
||
.hamburger .bar {
|
||
width: 20px;
|
||
height: 2px;
|
||
background: var(--gold);
|
||
border-radius: 2px;
|
||
position: relative;
|
||
}
|
||
.hamburger .bar::before,
|
||
.hamburger .bar::after {
|
||
content: "";
|
||
position: absolute;
|
||
width: 20px;
|
||
height: 2px;
|
||
left: 0;
|
||
background: var(--gold);
|
||
border-radius: 2px;
|
||
}
|
||
.hamburger .bar::before {
|
||
top: -6px;
|
||
}
|
||
.hamburger .bar::after {
|
||
top: 6px;
|
||
}
|
||
|
||
/* === Main Container === */
|
||
.container {
|
||
max-width: var(--max-width);
|
||
margin: 0 auto;
|
||
padding: 0 1rem;
|
||
/* Global Centering */
|
||
text-align: center;
|
||
}
|
||
|
||
/* === Hero Banner === */
|
||
.hero {
|
||
padding: 2rem 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 1.8rem;
|
||
text-align: center;
|
||
}
|
||
|
||
.hero-banner {
|
||
width: 100%;
|
||
max-width: 1080px;
|
||
border-radius: 14px;
|
||
overflow: hidden;
|
||
border: 1px solid var(--border);
|
||
box-shadow: var(--shadow);
|
||
}
|
||
.hero-banner img {
|
||
display: block;
|
||
width: 100%;
|
||
height: auto;
|
||
}
|
||
|
||
.hero-text {
|
||
max-width: 800px;
|
||
}
|
||
.hero-text h1 {
|
||
font-family: var(--font-headings);
|
||
font-size: 2.8rem;
|
||
letter-spacing: 0.8px;
|
||
color: var(--red); /* "Warlock" */
|
||
}
|
||
.hero-text h1 span {
|
||
color: var(--silver); /* "Studio" */
|
||
}
|
||
|
||
.hero-text p.lead {
|
||
color: var(--text);
|
||
font-size: 1.15rem;
|
||
margin-top: 0.6rem;
|
||
}
|
||
.hero-text p.lead strong {
|
||
color: var(--gold);
|
||
}
|
||
.hero-text p.lead a {
|
||
color: var(--gold-light);
|
||
text-decoration: none;
|
||
}
|
||
.hero-text p.lead a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
/* === Badges === */
|
||
.badges {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.5rem;
|
||
justify-content: center;
|
||
margin-top: 1.5rem;
|
||
}
|
||
.badges img {
|
||
transition: transform 200ms ease;
|
||
}
|
||
.badges img:hover {
|
||
transform: scale(1.05);
|
||
}
|
||
|
||
/* === Content Sections === */
|
||
section.content {
|
||
padding: 3rem 0;
|
||
border-bottom: 1px solid var(--border);
|
||
/* Center content blocks */
|
||
max-width: 900px;
|
||
margin-left: auto;
|
||
margin-right: auto;
|
||
}
|
||
section.content:last-of-type {
|
||
border-bottom: none;
|
||
}
|
||
.content h2 {
|
||
font-family: var(--font-headings);
|
||
font-size: 2.2rem;
|
||
color: var(--gold);
|
||
margin-bottom: 0.5rem;
|
||
text-transform: uppercase;
|
||
}
|
||
.content h3 {
|
||
font-family: var(--font-headings);
|
||
font-size: 1.5rem;
|
||
color: var(--silver);
|
||
margin-top: 1.5rem;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.content p,
|
||
.content .muted {
|
||
color: var(--muted);
|
||
font-size: 1.05rem;
|
||
margin-left: auto;
|
||
margin-right: auto;
|
||
}
|
||
.content p a {
|
||
color: var(--gold);
|
||
text-decoration: none;
|
||
}
|
||
.content p a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
/* === Lists (Override Centering) === */
|
||
.content ul,
|
||
.content ol {
|
||
margin-left: 1.5rem;
|
||
padding-left: 0.5rem;
|
||
margin-top: 1rem;
|
||
text-align: left; /* Override */
|
||
}
|
||
.content li {
|
||
margin-bottom: 0.5rem;
|
||
color: var(--muted);
|
||
}
|
||
.content li strong {
|
||
color: var(--text);
|
||
}
|
||
.clean-list {
|
||
list-style: none;
|
||
margin-left: 0;
|
||
padding-left: 0;
|
||
}
|
||
.clean-list li {
|
||
position: relative;
|
||
padding-left: 1.7rem;
|
||
margin-bottom: 0.8rem;
|
||
}
|
||
.clean-list li::before {
|
||
content: "◈";
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0.05em;
|
||
color: var(--gold);
|
||
font-weight: 700;
|
||
font-size: 1.1rem;
|
||
}
|
||
|
||
/* === Buttons === */
|
||
.btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.6rem;
|
||
padding: 0.7rem 1.3rem;
|
||
border-radius: 10px;
|
||
font-family: var(--font-headings);
|
||
font-weight: 700;
|
||
font-size: 1rem;
|
||
text-decoration: none;
|
||
transition: all 200ms ease;
|
||
border: 1px solid transparent;
|
||
cursor: pointer;
|
||
text-transform: uppercase;
|
||
}
|
||
.btn.primary {
|
||
background: var(--red);
|
||
color: var(--text);
|
||
border: 1px solid var(--red);
|
||
box-shadow: 0 0 20px rgba(179, 27, 27, 0.25);
|
||
}
|
||
.btn.primary:hover {
|
||
background: var(--gold);
|
||
color: var(--bg);
|
||
border-color: var(--gold);
|
||
box-shadow: var(--glow);
|
||
transform: translateY(-2px);
|
||
}
|
||
.btn.ghost {
|
||
background: transparent;
|
||
color: var(--silver);
|
||
border: 1px solid var(--silver);
|
||
}
|
||
.btn.ghost:hover {
|
||
color: var(--gold);
|
||
border-color: var(--gold);
|
||
background: var(--glass);
|
||
transform: translateY(-2px);
|
||
}
|
||
.button-bar {
|
||
display: flex;
|
||
gap: 1rem;
|
||
flex-wrap: wrap;
|
||
margin-top: 1.5rem;
|
||
align-items: center;
|
||
justify-content: center; /* Center buttons */
|
||
}
|
||
.btn svg {
|
||
opacity: 0.9;
|
||
}
|
||
|
||
/* === Download Area Specifics === */
|
||
.download-links {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 1.5rem;
|
||
margin-top: 1.5rem;
|
||
}
|
||
.download-links .badge-link img {
|
||
max-width: 200px;
|
||
transition: transform 200ms ease;
|
||
}
|
||
.download-links .badge-link:hover img {
|
||
transform: scale(1.05);
|
||
}
|
||
|
||
/* === Image/Video Grids === */
|
||
.grid-2 {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||
gap: 1.5rem;
|
||
margin-top: 1.5rem;
|
||
}
|
||
.grid-2 img {
|
||
width: 100%;
|
||
border-radius: 10px;
|
||
border: 1px solid var(--border);
|
||
box-shadow: var(--shadow);
|
||
}
|
||
.media-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.5rem;
|
||
margin-top: 1.5rem;
|
||
align-items: center;
|
||
}
|
||
.media-container video,
|
||
.media-container img {
|
||
max-width: 100%;
|
||
width: 100%;
|
||
max-width: 900px;
|
||
border-radius: 10px;
|
||
border: 1px solid var(--border);
|
||
box-shadow: var(--shadow);
|
||
}
|
||
|
||
/* === Tables (Override Centering) === */
|
||
.table-wrapper {
|
||
overflow-x: auto;
|
||
margin-top: 1.5rem;
|
||
border: 1px solid var(--border);
|
||
border-radius: 10px;
|
||
background: var(--panel);
|
||
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5);
|
||
text-align: left; /* Override */
|
||
}
|
||
table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
}
|
||
table th,
|
||
table td {
|
||
padding: 0.9rem 1.1rem;
|
||
border-bottom: 1px solid var(--border);
|
||
vertical-align: top;
|
||
font-size: 0.95rem;
|
||
}
|
||
table th {
|
||
background: var(--glass);
|
||
font-family: var(--font-headings);
|
||
letter-spacing: 0.5px;
|
||
font-weight: 700;
|
||
color: var(--red); /* Red headers */
|
||
}
|
||
table tbody tr:last-child td {
|
||
border-bottom: 0;
|
||
}
|
||
table tbody tr {
|
||
transition: background 150ms ease;
|
||
}
|
||
table tbody tr:hover {
|
||
background: rgba(255, 255, 255, 0.03);
|
||
}
|
||
table td {
|
||
color: var(--muted);
|
||
}
|
||
table td strong {
|
||
color: var(--text);
|
||
}
|
||
table td a {
|
||
color: var(--muted);
|
||
text-decoration: none;
|
||
}
|
||
table td a:hover {
|
||
color: var(--gold);
|
||
text-decoration: underline;
|
||
}
|
||
|
||
/* === Code (Override Centering) === */
|
||
/* Special override for structure section */
|
||
#structure {
|
||
max-width: 1200px; /* Wider */
|
||
text-align: left; /* Override */
|
||
}
|
||
#structure p {
|
||
text-align: left; /* Override */
|
||
}
|
||
pre {
|
||
background: var(--panel);
|
||
border: 1px solid var(--border);
|
||
border-radius: 10px;
|
||
padding: 1.2rem;
|
||
overflow-x: auto;
|
||
font-family: "Courier New", Courier, monospace;
|
||
font-size: 0.9rem;
|
||
line-height: 1.5;
|
||
margin-top: 1.5rem;
|
||
box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.5);
|
||
color: #b3cce6;
|
||
text-align: left; /* Override */
|
||
}
|
||
pre code {
|
||
font-family: inherit;
|
||
text-align: left; /* Override */
|
||
}
|
||
|
||
/* === Footer === */
|
||
footer.site-footer {
|
||
border-top: 1px solid var(--border);
|
||
margin-top: 3rem;
|
||
padding: 2rem 1rem;
|
||
color: var(--muted);
|
||
font-size: 0.9rem;
|
||
}
|
||
footer .footer-inner {
|
||
max-width: var(--max-width);
|
||
margin: 0 auto;
|
||
text-align: center;
|
||
}
|
||
footer a {
|
||
color: var(--gold);
|
||
text-decoration: none;
|
||
}
|
||
footer a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
/* === Responsive === */
|
||
@media (max-width: 920px) {
|
||
nav.primary-nav {
|
||
display: none;
|
||
}
|
||
.hamburger {
|
||
display: flex;
|
||
}
|
||
.hero-text h1 {
|
||
font-size: 2.2rem;
|
||
}
|
||
.content h2 {
|
||
font-size: 1.8rem;
|
||
}
|
||
}
|
||
@media (max-width: 520px) {
|
||
.hero-text h1 {
|
||
font-size: 1.8rem;
|
||
}
|
||
.hero-text p.lead {
|
||
font-size: 1rem;
|
||
}
|
||
.content p,
|
||
.content .muted {
|
||
font-size: 0.95rem;
|
||
}
|
||
.btn {
|
||
width: 100%;
|
||
justify-content: center;
|
||
}
|
||
.grid-2 {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
.brand .title {
|
||
font-size: 1.2rem;
|
||
}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<header class="site-header" role="banner">
|
||
<div class="nav-inner">
|
||
<a href="#home" class="brand" aria-label="Warlock-Studio Home">
|
||
<div class="title">Warlock<span>-Studio</span></div>
|
||
</a>
|
||
|
||
<nav class="primary-nav" aria-label="Primary navigation">
|
||
<a href="#home">Home</a>
|
||
<a href="#download">Download</a>
|
||
<a href="#previews">Previews</a>
|
||
<a href="#comparison">Comparison</a>
|
||
<a href="#features">Features</a>
|
||
<a href="#requirements">Requirements</a>
|
||
<a href="#models">Models</a>
|
||
<a href="#contribute">Contribute</a>
|
||
<a href="#license">License</a>
|
||
</nav>
|
||
|
||
<button
|
||
class="hamburger"
|
||
aria-label="Open menu"
|
||
onclick="toggleMobileMenu(event)"
|
||
>
|
||
<span class="bar"></span>
|
||
</button>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="container">
|
||
<section class="hero" id="home" aria-labelledby="hero-title">
|
||
<div class="hero-banner">
|
||
<img src="Assets/banner.png"/>
|
||
" alt="Warlock-Studio banner" />
|
||
</div>
|
||
<div class="button-bar" style="margin-top: 1.8rem">
|
||
<a
|
||
href="https://github.com/Ivan-Ayub97/Warlock-Studio"
|
||
target="_blank"
|
||
rel="noopener"
|
||
class="btn primary"
|
||
>
|
||
<svg
|
||
width="20"
|
||
height="20"
|
||
viewBox="0 0 24 24"
|
||
fill="currentColor"
|
||
xmlns="http://www.w3.org/2000/svg"
|
||
>
|
||
<path
|
||
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297 24 5.67 18.627.297 12 .297z"
|
||
></path>
|
||
</svg>
|
||
View on GitHub
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="badges" aria-hidden="true">
|
||
<!-- Badge de Build -->
|
||
<a
|
||
href="https://github.com/Ivan-Ayub97/Warlock-Studio/releases"
|
||
target="_blank"
|
||
rel="noopener"
|
||
>
|
||
<img
|
||
src="https://img.shields.io/badge/Build-Stable_Release-0A192F?style=for-the-badge&logo=github&logoColor=FFD700"
|
||
alt="Build Status"
|
||
/>
|
||
</a>
|
||
|
||
<!-- Badge de Versión -->
|
||
<a
|
||
href="https://github.com/Ivan-Ayub97/Warlock-Studio/releases/tag/4.2.1"
|
||
target="_blank"
|
||
rel="noopener"
|
||
>
|
||
<img
|
||
src="https://img.shields.io/badge/Version-4.2.1-FF4500?style=for-the-badge&logo=git&logoColor=white"
|
||
alt="Version"
|
||
/>
|
||
</a>
|
||
|
||
<!-- Badge de Licencia -->
|
||
<a href="LICENSE" target="_blank" rel="noopener">
|
||
<img
|
||
src="https://img.shields.io/badge/License-MIT-6A0DAD?style=for-the-badge&logo=open-source-initiative&logoColor=white"
|
||
alt="License"
|
||
/>
|
||
</a>
|
||
|
||
<!-- Badge de Descargas -->
|
||
<a
|
||
href="https://github.com/Ivan-Ayub97/Warlock-Studio/releases"
|
||
target="_blank"
|
||
rel="noopener"
|
||
>
|
||
<img
|
||
src="https://img.shields.io/github/downloads/Ivan-Ayub97/Warlock-Studio/total?style=for-the-badge&color=FFD700&logo=download&logoColor=black"
|
||
alt="Downloads"
|
||
/>
|
||
</a>
|
||
|
||
<!-- Badge de Plataforma -->
|
||
<a href="#">
|
||
<img
|
||
src="https://img.shields.io/badge/Platform-Windows%2011-0078D6?style=for-the-badge&logo=windows11&logoColor=white"
|
||
alt="Platform"
|
||
/>
|
||
</a>
|
||
|
||
<!-- Badge de Python -->
|
||
<a href="https://www.python.org/" target="_blank" rel="noopener">
|
||
<img
|
||
src="https://img.shields.io/badge/Python-3.10+-3776AB?style=for-the-badge&logo=python&logoColor=FFD700"
|
||
alt="Python"
|
||
/>
|
||
</a>
|
||
|
||
<!-- Badge de Issues (Nuevo) -->
|
||
<a
|
||
href="https://github.com/Ivan-Ayub97/Warlock-Studio/issues"
|
||
target="_blank"
|
||
rel="noopener"
|
||
>
|
||
<img
|
||
src="https://img.shields.io/github/issues/Ivan-Ayub97/Warlock-Studio?style=for-the-badge&color=FF0303&logo=github&logoColor=white"
|
||
alt="Issues"
|
||
/>
|
||
</a>
|
||
|
||
<!-- Badge de Last Commit (Nuevo) -->
|
||
<a
|
||
href="https://github.com/Ivan-Ayub97/Warlock-Studio/commits/main"
|
||
target="_blank"
|
||
rel="noopener"
|
||
>
|
||
<img
|
||
src="https://img.shields.io/github/last-commit/Ivan-Ayub97/Warlock-Studio?style=for-the-badge&color=2E8B57&logo=git&logoColor=white"
|
||
alt="Last Commit"
|
||
/>
|
||
</a>
|
||
</div>
|
||
|
||
<div class="hero-text">
|
||
<p class="lead">
|
||
Inspired by
|
||
<a href="https://github.com/Djdefrag" target="_blank" rel="noopener"
|
||
>Djdefrag</a
|
||
>
|
||
tools such as <strong>QualityScaler</strong> and
|
||
<strong>FluidFrames</strong>, Warlock-Studio provides a unified,
|
||
high-performance platform for
|
||
<strong
|
||
>upscaling, restoration, denoising, and frame
|
||
interpolation</strong
|
||
>.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="download" class="content" aria-labelledby="download-title">
|
||
<h2 id="download-title">Download Installer</h2>
|
||
<p class="muted">
|
||
Installers and releases are published for Windows (64-bit).
|
||
</p>
|
||
|
||
<div class="download-links">
|
||
<div
|
||
style="
|
||
display: flex;
|
||
flex-direction: row;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 1.5rem;
|
||
"
|
||
>
|
||
<div>
|
||
<div
|
||
class="sf-root"
|
||
data-id="3880091"
|
||
data-badge="oss-rising-star-black"
|
||
data-metadata="achievement=oss-rising-star"
|
||
style="width: 152px"
|
||
>
|
||
<a
|
||
href="https://sourceforge.net/projects/warlock-studio/"
|
||
target="_blank"
|
||
rel="noopener"
|
||
>
|
||
<img
|
||
src="rsc/oss-rising-star-black.svg"
|
||
alt="Warlock-Studio on SourceForge"
|
||
width="200"
|
||
style="display:block; margin:auto; margin-bottom:10px;"
|
||
/>
|
||
</a>
|
||
|
||
|
||
<a
|
||
href="https://github.com/Ivan-Ayub97/Warlock-Studio/releases/download/v4.2.1/Warlock-Studio-v4.2.1-Setup.exe"
|
||
target="_blank"
|
||
rel="noopener"
|
||
class="badge-link"
|
||
>
|
||
<img src="rsc/GitHub_Logo_WS.png" alt="Download from GitHub" />
|
||
</a>
|
||
</div>
|
||
<div class="button-bar">
|
||
<a
|
||
href="https://github.com/Ivan-Ayub97/Warlock-Studio/releases/download/v4.2.1/Warlock-Studio_Manual.pdf"
|
||
target="_blank"
|
||
rel="noopener"
|
||
class="btn ghost"
|
||
>
|
||
Download Manual (PDF)
|
||
</a>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="previews" class="content" aria-labelledby="previews-title">
|
||
<h2 id="previews-title">Interface Previews</h2>
|
||
<div class="grid-2">
|
||
<img src="rsc/Capture.png" alt="Main interface preview" />
|
||
<img src="rsc/CaptureCONSOLE.png" alt="Console preview" />
|
||
</div>
|
||
</section>
|
||
|
||
<section
|
||
id="comparison"
|
||
class="content"
|
||
aria-labelledby="comparison-title"
|
||
>
|
||
<h2 id="comparison-title">Quality Comparison</h2>
|
||
<p class="muted">
|
||
Side-by-side samples and short demo videos demonstrating restoration
|
||
and upscaling results.
|
||
</p>
|
||
|
||
<div class="media-container">
|
||
<video controls>
|
||
<source
|
||
src="https://github.com/user-attachments/assets/c72f389d-827e-49b9-91b7-fd13e5b59f22"
|
||
type="video/webm"
|
||
/>
|
||
Your browser does not support the video tag.
|
||
</video>
|
||
|
||
<video controls>
|
||
<source
|
||
src="https://github.com/user-attachments/assets/6695cce2-f42f-4955-8b43-56ec6d7b0bd2"
|
||
type="video/webm"
|
||
/>
|
||
Your browser does not support the video tag.
|
||
</video>
|
||
|
||
<img src="rsc/image_comparison.png" alt="Still image comparison" />
|
||
</div>
|
||
</section>
|
||
|
||
<section id="features" class="content" aria-labelledby="features-title">
|
||
<h2 id="features-title">Key Features</h2>
|
||
<ul class="clean-list">
|
||
<li>
|
||
<strong>AI Upscaling & Restoration</strong> – Utilize
|
||
<strong>Real-ESRGAN, BSRGAN, and IRCNN</strong> models for
|
||
denoising, super-resolution, and detail recovery.
|
||
</li>
|
||
<li>
|
||
<strong>Face Restoration (GFPGAN)</strong> – Recover facial details
|
||
from low-resolution or blurry images and video frames.
|
||
</li>
|
||
<li>
|
||
<strong>Frame Interpolation (RIFE)</strong> – Smooth motion or
|
||
generate slow-motion content with
|
||
<strong>2×, 4×, or 8× interpolation</strong>.
|
||
</li>
|
||
<li>
|
||
<strong>Advanced Hardware Acceleration</strong> – Intelligent
|
||
provider selection prioritizes <strong>CUDA</strong>, falls back to
|
||
<strong>DirectML</strong>, and finally <strong>CPU</strong> for
|
||
maximum compatibility and performance.
|
||
</li>
|
||
<li>
|
||
<strong>Batch Processing</strong> – Process multiple media files
|
||
simultaneously, saving time and effort.
|
||
</li>
|
||
<li>
|
||
<strong>Custom Workflows</strong> – Fine-grained control over
|
||
models, resolution, output formats, and quality parameters.
|
||
</li>
|
||
<li>
|
||
<strong>Open-Source & Extensible</strong> – Fully MIT licensed, for
|
||
contributors and developers.
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<section
|
||
id="requirements"
|
||
class="content"
|
||
aria-labelledby="requirements-title"
|
||
>
|
||
<h2 id="requirements-title">System Requirements</h2>
|
||
<ul class="clean-list">
|
||
<li><strong>OS:</strong> Windows 11 or higher (64-bit)</li>
|
||
<li><strong>RAM:</strong> 8GB+ recommended</li>
|
||
<li>
|
||
<strong>GPU:</strong> NVIDIA (for CUDA), AMD, or Intel GPU with
|
||
up-to-date drivers recommended
|
||
</li>
|
||
<li>
|
||
<strong>Storage:</strong> Sufficient free space for input and
|
||
processed media
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<section id="models" class="content" aria-labelledby="models-title">
|
||
<h2 id="models-title">Model Comparison</h2>
|
||
<p class="muted">
|
||
Common models bundled or supported by Warlock-Studio and their typical
|
||
use cases.
|
||
</p>
|
||
|
||
<div class="table-wrapper">
|
||
<table aria-label="Model Comparison">
|
||
<thead>
|
||
<tr>
|
||
<th>Model File</th>
|
||
<th>Use Case</th>
|
||
<th>Speed</th>
|
||
<th>Quality</th>
|
||
<th>Notes</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>GFPGANv1.4</strong></td>
|
||
<td>Face restoration</td>
|
||
<td>High</td>
|
||
<td>High</td>
|
||
<td>Optimal for portraits</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>BSRGANx2</strong></td>
|
||
<td>2× upscale + denoising</td>
|
||
<td>Medium</td>
|
||
<td>Very High</td>
|
||
<td>Suitable for lightly degraded media</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>BSRGANx4</strong></td>
|
||
<td>4× upscale + denoising</td>
|
||
<td>Low</td>
|
||
<td>Very High</td>
|
||
<td>For heavily degraded content</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>RIFE</strong></td>
|
||
<td>Frame interpolation</td>
|
||
<td>High</td>
|
||
<td>High</td>
|
||
<td>Smooth motion, slow-motion support</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>RIFE-Lite</strong></td>
|
||
<td>Lightweight interpolation</td>
|
||
<td>Very High</td>
|
||
<td>Medium</td>
|
||
<td>Faster, lower resource usage</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>RealESRGANx4</strong></td>
|
||
<td>General 4× upscaling</td>
|
||
<td>Medium</td>
|
||
<td>High</td>
|
||
<td>Balanced performance</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>RealESRNetx4</strong></td>
|
||
<td>Subtle restoration</td>
|
||
<td>Medium</td>
|
||
<td>High</td>
|
||
<td>Preserves natural image texture</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>RealSRx4_Anime</strong></td>
|
||
<td>Anime / line-art enhancement</td>
|
||
<td>Medium</td>
|
||
<td>High</td>
|
||
<td>Sharp edges for 2D art</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>IRCNN_L</strong></td>
|
||
<td>Light denoising</td>
|
||
<td>High</td>
|
||
<td>Medium</td>
|
||
<td>Mild artifact removal</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>IRCNN_M</strong></td>
|
||
<td>Medium denoising</td>
|
||
<td>High</td>
|
||
<td>Medium</td>
|
||
<td>Stronger artifact cleanup</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</section>
|
||
|
||
<section
|
||
id="contribute"
|
||
class="content"
|
||
aria-labelledby="contribute-title"
|
||
>
|
||
<h2 id="contribute-title">Contributions</h2>
|
||
<p class="muted">We welcome contributions from the community:</p>
|
||
<ol>
|
||
<li><strong>Fork</strong> the repository on <strong>GitHub.</strong></li>
|
||
<li><strong>Create a branch</strong> for your feature or bug fix.</li>
|
||
<li>
|
||
<strong>Submit a Pull Request</strong> with a detailed description
|
||
and testing notes.
|
||
</li>
|
||
</ol>
|
||
|
||
<p style="margin-top: 1.5rem">
|
||
Contact:
|
||
<a href="mailto:negroayub97@gmail.com">negroayub97@gmail.com</a>
|
||
</p>
|
||
</section>
|
||
|
||
<section id="license" class="content" aria-labelledby="license-title">
|
||
<h2 id="license-title">License & Technologies</h2>
|
||
</p>
|
||
|
||
<h3>Integrated Technologies & Licenses</h3>
|
||
<div class="table-wrapper">
|
||
<table aria-label="Integrated Technologies">
|
||
<thead>
|
||
<tr>
|
||
<th>Technology</th>
|
||
<th>License</th>
|
||
<th>Author / Maintainer</th>
|
||
<th>Source</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>QualityScaler</td>
|
||
<td>MIT</td>
|
||
<td>
|
||
<a href="https://github.com/Djdefrag" target="_blank"
|
||
>Djdefrag</a
|
||
>
|
||
</td>
|
||
<td>
|
||
<a
|
||
href="https://github.com/Djdefrag/QualityScaler"
|
||
target="_blank"
|
||
>GitHub</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>FluidFrames</td>
|
||
<td>MIT</td>
|
||
<td>
|
||
<a href="https://github.com/Djdefrag" target="_blank"
|
||
>Djdefrag</a
|
||
>
|
||
</td>
|
||
<td>
|
||
<a
|
||
href="https://github.com/Djdefrag/FluidFrames"
|
||
target="_blank"
|
||
>GitHub</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Real-ESRGAN</td>
|
||
<td>BSD 3-Clause / Apache</td>
|
||
<td>Xintao Wang</td>
|
||
<td>
|
||
<a
|
||
href="https://github.com/xinntao/Real-ESRGAN"
|
||
target="_blank"
|
||
>GitHub</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>GFPGAN</td>
|
||
<td>Apache 2.0</td>
|
||
<td>TencentARC / Xintao Wang</td>
|
||
<td>
|
||
<a href="https://github.com/TencentARC/GFPGAN" target="_blank"
|
||
>GitHub</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>RIFE</td>
|
||
<td>Apache 2.0</td>
|
||
<td>hzwer</td>
|
||
<td>
|
||
<a
|
||
href="https://github.com/megvii-research/ECCV2022-RIFE"
|
||
target="_blank"
|
||
>GitHub</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>BSRGAN</td>
|
||
<td>Apache 2.0</td>
|
||
<td>Kai Zhang</td>
|
||
<td>
|
||
<a href="https://github.com/cszn/BSRGAN" target="_blank"
|
||
>GitHub</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>IRCNN</td>
|
||
<td>BSD / Mixed</td>
|
||
<td>Kai Zhang</td>
|
||
<td>
|
||
<a href="https://github.com/cszn/IRCNN" target="_blank"
|
||
>GitHub</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>ONNX Runtime</td>
|
||
<td>MIT</td>
|
||
<td>Microsoft</td>
|
||
<td>
|
||
<a
|
||
href="https://github.com/microsoft/onnxruntime"
|
||
target="_blank"
|
||
>GitHub</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>FFmpeg</td>
|
||
<td>LGPL / GPL</td>
|
||
<td>FFmpeg Team</td>
|
||
<td>
|
||
<a href="https://ffmpeg.org" target="_blank">Official Site</a>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>ExifTool</td>
|
||
<td>Artistic License</td>
|
||
<td>Phil Harvey</td>
|
||
<td>
|
||
<a href="https://exiftool.org/" target="_blank"
|
||
>Official Site</a
|
||
>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer class="site-footer" role="contentinfo">
|
||
<div class="footer-inner">
|
||
<footer class="footer">
|
||
<p>© 2025 <strong>Iván Eduardo Chavez Ayub</strong> — Licensed under the <a href="https://opensource.org/licenses/MIT" target="_blank" rel="noopener noreferrer">MIT License</a>.</p>
|
||
<p class="muted">Additional terms and attributions can be found in <code>NOTICE.md</code>.</p>
|
||
</footer>
|
||
|
||
Hosted on
|
||
<a href="https://pages.github.com/" target="_blank" rel="noopener"
|
||
>GitHub Pages</a
|
||
>.
|
||
</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
function toggleMobileMenu(e) {
|
||
const existingOverlay = document.getElementById("mobile-nav-overlay");
|
||
if (existingOverlay) {
|
||
existingOverlay.remove();
|
||
return;
|
||
}
|
||
|
||
const overlay = document.createElement("div");
|
||
overlay.id = "mobile-nav-overlay";
|
||
overlay.style.position = "fixed";
|
||
overlay.style.top = "70px"; // Height of header
|
||
overlay.style.left = "0";
|
||
overlay.style.right = "0";
|
||
overlay.style.bottom = "0";
|
||
overlay.style.background =
|
||
"linear-gradient(180deg, rgba(17,17,17,0.9), rgba(17,17,17,0.98))";
|
||
overlay.style.zIndex = 1400;
|
||
overlay.style.padding = "1.5rem";
|
||
overlay.style.overflowY = "auto";
|
||
overlay.style.backdropFilter = "blur(6px)";
|
||
overlay.style.animation = "fadeIn 300ms ease";
|
||
|
||
const list = document.createElement("div");
|
||
list.style.display = "flex";
|
||
list.style.flexDirection = "column";
|
||
list.style.gap = "0.6rem";
|
||
list.style.maxWidth = "420px";
|
||
list.style.margin = "0 auto";
|
||
|
||
const createLink = (txt, href) => {
|
||
const a = document.createElement("a");
|
||
a.href = href;
|
||
a.textContent = txt;
|
||
a.style.display = "block";
|
||
a.style.padding = "12px 18px";
|
||
a.style.borderRadius = "10px";
|
||
a.style.background = "rgba(255,255,255,0.02)";
|
||
a.style.border = "1px solid var(--border)";
|
||
a.style.color = "#e6eef6";
|
||
a.style.textDecoration = "none";
|
||
a.style.fontFamily = "var(--font-headings)";
|
||
a.style.fontWeight = "700";
|
||
a.style.fontSize = "1.1rem";
|
||
a.style.textTransform = "uppercase";
|
||
a.style.textAlign = "center";
|
||
a.addEventListener("click", () => {
|
||
setTimeout(() => {
|
||
if (document.body.contains(overlay)) {
|
||
document.body.removeChild(overlay);
|
||
}
|
||
}, 150);
|
||
});
|
||
return a;
|
||
};
|
||
|
||
// --- UPDATED LINKS (English) ---
|
||
list.appendChild(createLink("Home", "#home"));
|
||
list.appendChild(createLink("Download", "#download"));
|
||
list.appendChild(createLink("Previews", "#previews"));
|
||
list.appendChild(createLink("Comparison", "#comparison"));
|
||
list.appendChild(createLink("Features", "#features"));
|
||
list.appendChild(createLink("Requirements", "#requirements"));
|
||
list.appendChild(createLink("Models", "#models"));
|
||
list.appendChild(createLink("Structure", "#structure"));
|
||
list.appendChild(createLink("Contribute", "#contribute"));
|
||
list.appendChild(createLink("License", "#license"));
|
||
|
||
overlay.appendChild(list);
|
||
|
||
overlay.addEventListener("click", (ev) => {
|
||
if (ev.target === overlay) document.body.removeChild(overlay);
|
||
});
|
||
|
||
document.body.appendChild(overlay);
|
||
|
||
if (!document.getElementById("mobile-nav-styles")) {
|
||
const styleSheet = document.createElement("style");
|
||
styleSheet.id = "mobile-nav-styles";
|
||
styleSheet.innerText = `
|
||
@keyframes fadeIn {
|
||
from { opacity: 0; transform: translateY(-10px); }
|
||
to { opacity: 1; transform: translateY(0); }
|
||
}
|
||
`;
|
||
document.head.appendChild(styleSheet);
|
||
}
|
||
}
|
||
|
||
// smooth in-view animation
|
||
const io = new IntersectionObserver(
|
||
(entries) => {
|
||
entries.forEach((e) => {
|
||
if (e.isIntersecting) {
|
||
e.target.style.transform = "translateY(0)";
|
||
e.target.style.opacity = "1";
|
||
e.target.style.transition = "all 600ms cubic-bezier(.2,.9,.3,1)";
|
||
io.unobserve(e.target);
|
||
}
|
||
});
|
||
},
|
||
{ threshold: 0.05 }
|
||
);
|
||
|
||
document
|
||
.querySelectorAll("section.content, section.hero")
|
||
.forEach((s) => {
|
||
s.style.transform = "translateY(15px)";
|
||
s.style.opacity = "0";
|
||
io.observe(s);
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|
||
|
||
|
||
|
||
|
||
|