Kağıttaki Plan ile Depodaki Gerçeği Buluşturmak: Kendi ERP Sistemimizi Nasıl Geliştirdik?

Üretim yapan bir işletmenin kalbi üretim bandında atsa da, beyni depodaki stoklar ve ofisteki planlamadır. Hava yastığı (dunnage bag) üretimi yaptığımız şirketimiz Show Dunnage’da, büyüyen operasyonumuzla birlikte standart stok takip yazılımlarının veya Excel tablolarının bize yetmediğini fark ettik.

Bir üretici için en büyük kabus, kağıt üzerinde var görünen bir malzemenin fiziksel olarak depoda olmaması veya tam tersi durumdur. Bu sorunu kökünden çözmek, operasyonel hızımızı artırmak ve maliyetlerimizi kuruşu kuruşuna takip edebilmek için tamamen kendi iş akışımıza özel SD-Stock v2 isimli ERP (Kurumsal Kaynak Planlaması) ve MRP (Malzeme İhtiyaç Planlaması) sistemimizi geliştirdik.

Bu yazıda, bir üretim tesisinin dijital dönüşümünü ve “ihtiyaca özel” bir yazılımın şirkete kattığı değeri paylaşmak istiyorum.

Temel Felsefemiz: “Teorik” ile “Gerçek” Arasındaki Farkı Yönetmek

Herhangi bir ürünün bir üretim “reçetesi” vardır. Ancak sahada işler her zaman reçetedeki gibi kusursuz ilerlemez. Fireler verilir, ortak malzemeler kullanılır veya planlanandan biraz daha fazla hammadde tüketilir.

SD-Stock v2'yi tasarlarken temel felsefemizi şu şekilde belirledik: “Reçetedeki Plan (Theoretical) ile Depodaki Gerçek (Actual) arasındaki farkı kusursuz yönetmek.” Sadece ne üretildiğini değil, “bu üretimi yaparken gerçekte ne kadar kaynak tükettik ve bu tüketimin ne kadarı fire?” sorusunu Sipariş Numarası (PO) bazında izlenebilir hale getirdik.

Peki bunu nasıl başardık? İşin arka planında çalışan, sahadaki operatörü yormayan ama arka planda karmaşık hesaplamalar yapan akıllı kurgularımız var.

1. Akıllı İş Emri ve Kampanya Üretimi (Batch Production)

Müşteriden gelen tek bir sipariş (PO) içinde farklı ebatlarda veya özelliklerde birçok ürün olabilir. Eski sistemlerde her bir alt ürün için ayrı iş emirleri açmak ve bunları tek tek yönetmek operatörler için ciddi bir zaman kaybıydı.

Geliştirdiğimiz sistemde, aynı siparişe ait farklı üretim kalemlerini tek bir “Kampanya” olarak grupladık. Sahadaki operatör, ekranda karmaşık listeler yerine sadece o an üretmesi gereken sipariş grubunu görüyor ve üretimi tek tuşla, bütüncül olarak kapatabiliyor. Bu, hem ekran kalabalığını önledi hem de insan kaynaklı hata payını minimuma indirdi.

2. Adil Maliyet Dağıtımı (Oransal Dağıtım Algoritması)

Üretimdeki en zor konulardan biri, bant, valf veya yapıştırıcı gibi “ortak” kullanılan malzemelerin maliyetini farklı siparişlere doğru dağıtmaktır.

Sistemimize entegre ettiğimiz Oransal Dağıtım Algoritması, üretim bittiğinde depodan çıkan toplam net hammaddeyi ve operatörün girdiği fire oranını alır; bu rakamları o gün üretilen iş emirlerinin hacmine göre matematiksel olarak paylaştırır. Böylece depodan ikinci kez stok düşümü yapmaya gerek kalmaz ve her bir siparişin bize gerçek maliyetinin ne olduğunu adil bir şekilde görebiliriz.

3. Panik Alımlarını Bitiren “Akıllı MRP”

Klasik stok programları, reçeteye bakar ve “Üretim için 100 birim hammadde lazım, depoda 50 var, hemen satın al!” uyarısı verir. Ancak o eksik olan 50 birim hammadde, belki de o an zaten üretim sahasına (WIP — Yarı Mamul) çıkarılmış durumdadır.

SD-Stock v2'nin reçete mantığı sadece depodaki mala değil, sahaya verilmiş stoklara da bakar. Bir hammadde depodan üretim sahasına geçmişse, sistem bunu “Eldeki Stok” olarak kabul eder ve satın alma departmanına gereksiz “Acil Alım” uyarıları gitmesini engeller. Ayrıca malzemeleri “Ürün Bazlı” ve “Koli Bazlı” olarak ikiye ayırarak, üretim listesindeki gereksiz detayları gizler ve ekranı sadeleştiririz.

4. Canlı Mutabakat ve İade Yönetimi

Üretim vardiyası bittiğinde, operatörün girdiği verilerle deponun gerçek durumu anlık olarak kıyaslanır. Geliştirdiğimiz Kapanış Ekranı, depodan çıkan malı ve sisteme girilen üretimi saniyeler içinde analiz ederek “Fazla” veya “Eksik” uyarısı verir. Bir hata varsa, vardiya bitmeden ve sorun büyümeden o an çözülür. Artan hammaddeler sisteme kolayca “İade” olarak girilir ve bu iade doğrudan siparişin maliyetini düşürerek bilançomuza pozitif yansır.

Şirketimiz İçin Sonuç ve Kazanımlar

Kendi iç dinamiklerimize göre modern web teknolojileriyle geliştirdiğimiz, sadece bizim kurallarımıza itaat eden ve şirketimizle birlikte büyüyebilen bir sisteme kavuştuk.

Operasyon sahasında modern, sade ve hata yapmaya izin vermeyen bir kullanıcı arayüzü sunarken; yönetim tarafında sipariş bazlı karlılık, anlık depo durumu ve akıllı satın alma raporları sağladık. Kağıt üzerinde tasarlanan özel iş emri çıktılarıyla (operatörlerin not alabileceği alanlara sahip formlar) dijital ile fiziksel dünyayı birbirine bağladık.

Sonuç olarak; Show Dunnage olarak sadece kaliteli ürünler üretmekle kalmıyor, bu ürünleri üretirken kullandığımız arka plan teknolojilerini de kendi mühendislik vizyonumuzla sıfırdan inşa ediyoruz. Görünen o ki, iyi kurgulanmış bir dijital altyapı, en az sahadaki makinalar kadar şirketin büyümesine ivme kazandırıyor.

👋 Merhaba! Geliştirme ve yapay zeka dünyasında koştururken favori masaüstü ortamımı ve kullandığım araçları paylaşmak istedim. Bu yazıda Ubuntu’nun neden vazgeçilmezim olduğunu, arayüzümü nasıl özelleştirdiğimi ve üretkenliğimi katlayan AI ile verimlilik araçlarımı göreceksiniz.

💻 Neden Linux (Ubuntu)?

• 👐 Özgür Yazılım
  Kaynak kodu açık olan yazılımlar sayesinde sistemi dilediğim gibi inceleyebiliyor, değiştirebiliyor ve paylaşabiliyorum.
• 🤖 AI Destekli Çözüm
  Artık sorunları forumlarda arayıp döküman okumak yerine terminalde gemini CLI veya ChatGPT gibi yapay zeka araçlarıyla anında, detaylı çözümlere ulaşabiliyorum.
• ⚡ Hafiflik & Kararlılık
  Özellikle LTS sürümleriyle sisteminizin yıllarca sorunsuz çalışmasını sağlıyor. Gereksiz servisler çalışmıyor.
• 🎨 Derin Özelleştirme
  İstediğim pencere efektini aktif eder, panel yerleşimini değiştirebilir, klavye kısayollarını baştan tanımlayabiliyorum. Top bar organizasyonu ile uygulamalarıma kolayca ulaşabiliyorum.
• 🔐 Tam Sistem Erişimi
  Root izinleriyle her dosyaya, her servise müdahale edebiliyorum. Backup, firewall, ağ ayarları… Hepsi elimde.

🎨 Masaüstü Arayüzüm

Ubuntu’nun varsayılan masaüstü ortamı GNOME üzerine kuruluyum.

• 🎨 Tema & İkon Paketi: Koyu tonlu “Dracula” GTK teması ve “Papirus” ikon seti. Göz yormayan ama şık bir kombinasyon.
• 📐 Panel Düzeni: Sol tarafta dock, üstte durum çubuğu.
• 🔝 Üst Panel (Top Bar):

⏰ Hızlı Erişim İkonları: Saat & takvim, pil yüzdesi, ağ bağlantısı, Bluetooth durumu, ses & mikrofon kontrolleri, telefon bağlantısı,kullanıcı menüsü.

🎵 Medya Kontrolleri: Çalan parçayı gösteren oynat/duraklat, ileri/geri tuşları.

📊 Veri Göstergeleri: Ağ hızı, pil şarj hızı, CPU/GPU sıcaklığı.

🖼️ Wallpaperm: Arka planda geometrik altıgen desenli siyah-kırmızı duvar kağıdı — minimal ve enerjik.

🛠️ Kullandığım Uygulamalar

🌐 Tarayıcılar ve Öne Çıkan Özellikleri

• 🦊 Vivaldi

🗂️ Yan Panel (Sidebar): , ChatGPT, Gemini, Translate, Tarayıcı Geçmişi, İndirilenler, okuma listesi ve web panelleri.

🗄️ Sekme Grupları: Projeye göre sekmeleri organize etme.

⚙️ Derin Özelleştirme: Fare hareketleri, klavye kısayolları, tema ayarları.

• 🌙 Zen Browser

🔍 Minimal & Odaklı: Gereksiz menüler yok, göz rahat.

📖 Yerleşik Okuma Modu: Uzun yazıları temiz arayüzde okuma.

• 🔗 Chromium

🛠️ Açık Kaynak & Kararlı: Chrome eklentilerini sorunsuz kullanma. Güvenlik ve Gizlilik odaklı kullanım.

💻 VS Code & GitHub Copilot

• 💻 VS Code: Zengin eklenti deposu ve özelleştirilebilir arayüz.

🤖 Copilot: Kod önerileri, fonksiyon şablonları, test snippet’leri.

⚙️ Gemini CLI

• 📥 Terminalde Anında Geri Bildirim: Terminale gemini yaz, sorunuzu sorun, yanıtınızı alın.
• 📂 Dosya Tabanlı İş Akışı: .md dosyalarını açıp düzenleyebiliyor.
• 🔒 Gizlilik: Tüm işlemler yerelde, API anahtarları dışarı çıkmıyor.

📝 Notion

📋 Hepsi Bir Arada: Proje planı, yapılacaklar, fikir panoları.

• 🔗 Bağlantılı Notlar: Birbirine referanslı içeriklerle hızlı erişim.

🧩 GNOME Eklentileri

GNOME, modern bir Linux masaüstü ortamı; eklentilerle sınırlarını zorlayabiliyorum.

1. 🔵 Bluetooth Quick Connect

Bluetooth cihazları tek tıkla eşleştirip bağlanıyor.

2. 🔥 Burn My Windows

Aktif pencereyi yarı transparan yapıp hızlı bakış atmamı sağlıyor.
sekme geçişleri, açılıp kapanma temaları uygulanabiliyor.

3. 📋 Clipboard Indicator

Panodaki geçmişi listeliyor, önceki kopyaları yapıştırmayı kolaylaştırıyor.

4. 🔄 Coverflow Alt-Tab

Uygulamalar arasında 3D kapak akışıyla geçiş efekti sunuyor.

5. 📥 Dash to Panel

Sol dock’u alt panele taşıyarak simgeleri kalıcı hale getiriyor.

6. 📑 Extension List

Yüklü eklentileri tek yerden yönetmemi sağlıyor.

7. ⭐ Frippery Panel Favorites

Favori uygulamalarımı üst panelde sabitliyorum.

8. 📱 GSConnect

Telefonla dosya, bildirim, klavye-fare entegrasyonu.

9. 🎵 Media Controls

Müzik/video kontrollerini panelden yapıyorum.

10. 🔍 Open Bar

Komut paleti gibi hızlı uygulama/ayar başlatma çubuğu.

11. 🔈 Quick Settings Audio Panel

Ses çıkış cihazlarını ve mikrofonu hızlıca değiştiriyorum.

12. 🔧 Top Bar Organizer

Panel ikonlarının sırasını ve görünümünü düzenliyorum.

13. 📱 Ubuntu AppIndicators

AppIndicator tabanlı simgeleri GNOME’a geri kazandırıyor.

14. 📌 Ubuntu Dock

Sol dock çubuğunu sabitliyor ve özelleştirme seçenekleri sunuyor.

15. 🪟 Ubuntu Tiling Assistant

Pencereleri yarıya bölüp hizalıyorum, çoklu pencere verimliliği artıyor.

16. 🎨 User Themes

Kendi GTK/ikon temalarımı GNOME’a entegre edebiliyorum.

🎯 Sonuç

Ubuntu + GNOME + doğru eklentiler + AI destekli araçlarla çalışma ortamımı hem kişiselleştirdim hem de verimliliğimi 🚀 artırdım. Umarım bu rehber sizin de masaüstünüzü özelleştirirken ilham olur! ✨

Coding with artificial intelligence is no longer a scene from a science fiction movie; it’s a reality of our lives. However, you can think of AI as a smart but inexperienced intern who has just joined your project. If you don’t clearly explain what to do, the results can be irrelevant to your project or completely nonsensical.

This is where a new approach comes in to solve this problem: Context Engineering.

From Giving Commands to Teaching the Project

Until now, we communicated with AI using specific commands like, “Build me a login screen.” This method is called Prompt Engineering. However, this approach is like telling an intern to just “paint a wall.” Which color? Which room? What type of paint? Without these details, the result will likely be far from your expectations.

Context Engineering, on the other hand, is the art of explaining the entire project to the AI. Just as we explain the project’s purpose, rules, and overall structure to a new team member, we provide this “context” to the AI. This way, it not only performs the requested task but also delivers work that is consistent with the project’s spirit and standards.

Why Your AI Needs to See the “Big Picture”

Artificial intelligence models learn by analyzing billions of data points from the internet. However, they cannot know your project’s unique rules, the technologies you prefer to use, or your specific design language. When you don’t provide this information, they produce generic solutions that are incompatible with your project.

Furthermore, AI has a “short-term memory.” If you give it very long commands, it might forget what you said at the beginning. Context Engineering solves this problem by making this information permanent.

What Is a Context File? Here’s a Simple Example

So, how do we provide this information to the AI? With simple text files that we place inside our project folder! We call these “context files.”

For instance, imagine we create a rules.md file for a simple website project like this:

# Project Rules

## 1. Technology
- This project will be written in **JavaScript**.
- **TailwindCSS** library will be used for styling (CSS). Do not use any other CSS method.

## 2. Structure
- All JavaScript code must be located inside the `src/scripts` folder.

## 3. Guidelines
- The website must be mobile-responsive.
- Always use the color code `bg-blue-500` for buttons.

As you can see, this file is extremely simple and easy to understand. Now, when we ask the AI to create a button, it will read this file and automatically design the button with the bg-blue-500 color and make it mobile-responsive. We don't need to repeat these rules every single time.

In Conclusion

Context Engineering transforms AI from a tool that just follows commands into a smart assistant that understands your project’s rules and acts accordingly. By creating simple rule files at the very beginning of your project, you can get consistent, error-free, and precisely tailored results throughout your development process.

In short, if you want to get the best out of AI, don’t just tell it what you want; teach it the “context” of your project.

Change is Inevitable

Software development is undergoing a radical transformation with the tools provided by artificial intelligence. However, this change is particularly criticized by senior developers who rely on traditional methods. But can this resistance keep up with the speed of technology?

Why Is AI-Assisted Development Controversial?

Senior developers often view AI-powered tools with skepticism, misunderstanding the nature of technology itself. For example, low-code platforms and cloud technologies faced similar reactions in the past. Today’s argument:
“A developer who doesn’t write code isn’t a real professional!”

The Driving Metaphor: It’s About Dynamics, Not Just Details

A good driver doesn’t need to know every technical detail of a car. What truly matters is managing its dynamics — acceleration, braking, and cornering. Similarly, an AI-powered developer should understand model limitations, optimize prompts, and bridge gaps through documentation and web searches when AI falls short.

Why AI Skills Stand Out?

• Speed & Efficiency: AI automates repetitive tasks, allowing developers to focus on strategic work.
• Accessibility: Even those with limited coding knowledge can build MVPs (prototypes) with AI.
• Creativity: Developers can design user-focused solutions without getting lost in technical complexities.

Response to the “They Don’t Know How to Code!” Argument

AI-based development does not eliminate coding knowledge; it redefines it. A developer must understand:

• Fundamental programming logic,
• System design,
• Business requirements.

The key difference is a shift from focusing on “How?” to “What?” — turning software from a technical discipline into a multidisciplinary art.

A Call to Senior Developers & Employers

• Adapt: AI is a tool that accelerates prototyping. Experienced teams should leverage this power.
• Embrace New Talent: Value lies not in lines of code but in problem-solving ability.
• Don’t Fall Behind: AI is evolving faster than Moore’s Law. Those who resist today will lose the competition tomorrow.

Final Thought: The Only Constant is Change

AI is democratizing software development. Senior developers and employers should see this shift as an opportunity, not a threat. Remember:

• The rise of automobiles didn’t eliminate horse breeders; it shifted their focus to automotive engineering.
• Today, the focus should be on designing smart solutions rather than just writing code.

The future belongs to those who collaborate with AI. Which side are you on?

Turkish version:

Gelecek AI Becerili Developerların: Neden Vazgeçilmez Olacaklar?

Değişim Kaçınılmaz

Yazılım geliştirme, yapay zekanın sunduğu araçlarla kökten dönüşüyor. Ancak bu değişim, özellikle geleneksel yöntemlere bağlı senior developerlar tarafından eleştiriliyor. Peki bu direnç, teknolojinin hızına yetişebilecek mi?

Neden AI Destekli Geliştirme Tartışılıyor?

Senior developerların AI tabanlı araçlarla çalışanlara şüpheyle bakması, teknolojinin doğasını yanlış yorumluyor. Örneğin, low-code platformlar ve bulut teknolojileri de benzer tepkiler almıştı. Bugünkü argüman:
“Kod yazmayan developer, gerçek bir profesyonel değil!”

Araba Metaforu: Detay Değil, Dinamik Önemli

İyi bir şoför, aracın tüm teknik detaylarını bilmek zorunda değildir. Önemli olan, dinamikleri (hızlanma, fren, viraj) yönetmektir. Aynı şekilde, AI ile çalışan bir developer da model sınırlamalarını, prompt optimizasyonunu bilmeli, hatta modellerin yetersiz kaldığı noktalarda dökümantasyon ve web aramalarıyla bu açığı kapatabilmelidir.

AI Becerileri Neden Öne Çıkıyor?

• Hız ve Verimlilik: AI, tekrarlayan işleri otomatize ederek developerlara stratejik odaklanma sağlar.
• Erişilebilirlik: Kodlama bilgisi sınırlı olanlar bile AI ile MVP (prototip) oluşturabilir.
• Yaratıcılık: Teknik detaylara takılmadan kullanıcı odaklı çözümler üretmek mümkün.

“Kod Bilmiyorlar!” İddiasına Yanıt

AI tabanlı geliştirme, kod bilgisini yok etmez, yeniden tanımlar. Bir developer:

• Temel programlama mantığını,
• Sistem tasarımını,
• İş gereksinimlerini anlamalı.

Fark, “Nasıl?” yerine “Ne?” sorusuna odaklanmalarıdır. Bu, yazılımı teknik bir disiplinden çok disiplinli bir sanata dönüştürüyor.

Senior’lara ve İşverenlere Çağrı

• Adapte Olun: AI, prototiplemeyi hızlandıran bir araç. Deneyimli ekipler bu gücü kullanmalı.
• Yeni Yeteneklere Açık Olun: Değer, satır kodda değil, çözüm üretme becerisinde.
• Geç Kalmayın: AI, Moore Yasası’ndan hızlı ilerliyor. Bugün direnenler, yarın rekabeti kaybeder.

Son Söz: Değişmeyen Tek Şey Değişim

AI, yazılımı demokratikleştiriyor. Senior’lar ve işverenler, bu değişimi tehdit değil, fırsat olarak görmeli. Unutmayın:

• Araba çağında at yetiştiricileri kaybolmadı, sadece odak otomotiv mühendisliğine kaydı.
• Bugün de odak, kod yazmaktan çok, akıllı çözümler tasarlamak olmalı.

Gelecek, AI ile iş birliği yapanların olacak. Siz hangi taraftasınız?

Artificial intelligence (AI) is now a part of our daily lives, and one of its most fascinating applications is AI agents. But what exactly are AI agents, and why are they set to play a bigger role in the future? In this article, we’ll explore what AI agents are, how they work, and what the future holds for them from a technical perspective.

What Are AI Agents?

AI agents are intelligent systems that perform specific tasks, gather data from their environment, and improve as they learn. They can make decisions on their own and take actions to achieve defined objectives. While they are programmed by humans, they can often operate without direct human intervention.

Technical Foundations

AI agents operate based on several core technologies:

• Machine Learning (ML): A technique that enables AI agents to learn automatically from data and improve their performance in specific tasks. ML includes various algorithms that detect patterns and relationships within data.
• Deep Learning: A subset of ML that uses neural networks to learn from large datasets. AI agents using deep learning can handle complex tasks more effectively.
• Natural Language Processing (NLP): A set of techniques that enable AI agents to understand and generate human language. This allows agents to interact through text-based communication and perform language-based tasks.

Types of AI Agents

AI agents come in different forms:

• Simple Reflex Agents: They follow predefined rules based on immediate conditions. For example, an air conditioner that turns on when the temperature rises above a certain threshold.
• Model-Based Agents: They analyze their environment and make decisions accordingly. For instance, robotic vacuum cleaners map out a room to find the most efficient cleaning path.
• Learning Agents: They improve over time by learning from experience. For example, customer service chatbots adapt to frequently asked questions and provide better responses.

Where Are AI Agents Used?

AI agents are already widely used across different industries:

• Virtual Assistants (Siri, Alexa, Google Assistant): AI-powered assistants that understand user commands and execute tasks.
• Autonomous Vehicles (Tesla, Waymo): AI-driven cars that process real-time data to navigate without human intervention.
• Finance (Trading Bots, Risk Analysis): AI systems that analyze market trends and execute financial transactions.
• Customer Support (Chatbots): Automated bots that provide customer service on company websites.

The Future of AI Agents

Over the coming years, AI agents will continue to evolve, making our lives even more efficient. Here are some key developments we can expect:

1. Fully Automated Businesses: Companies could operate customer service, financial management, and more using AI agents, minimizing human intervention.
2. Personal Assistants: AI agents capable of learning personal habits and making intelligent recommendations could become essential in daily life.
3. Healthcare Applications: AI agents may assist in early disease detection and provide doctors with valuable insights.
4. Smarter Cities: AI-driven traffic management, security systems, and environmental monitoring could enhance urban living.

The most prominent fields of today’s technology — artificial intelligence (AI), blockchain, and quantum computers — are transforming industries individually. However, their convergence holds the potential to spark one of the most significant technological leaps in human history. Together, these three technologies present a monumental opportunity to create the next generation of secure, fast, and intelligent systems.

The Integration of Artificial Intelligence and Blockchain

Artificial intelligence plays a pivotal role in analyzing large datasets, making predictions, and assisting decision-making processes. Yet, the success of AI systems heavily depends on the reliability and integrity of the data they utilize. This is where blockchain steps in as a critical enabler for AI.

Blockchain ensures that data is stored securely, immutably, and transparently. For instance:

• In Healthcare: AI models trained on verified patient data stored on blockchain can deliver more accurate predictions.
• In Finance: Blockchain-based data storage enhances the transparency of AI-driven financial forecasting models.

Moreover, AI-powered smart contracts operating on blockchain networks can automate complex processes, making them more intelligent and efficient.

The Impact of Quantum Computers on Blockchain and AI

Quantum computers possess computational power far beyond that of classical computers, which presents both opportunities and challenges for blockchain and AI.

• Opportunities: The processing power of quantum computers can accelerate cryptographic operations in blockchain networks and reduce the training times for AI models. For example, groundbreaking advancements can be achieved in complex fields such as drug development when AI and quantum computers work together.
• Challenges: Quantum computers have the potential to break the cryptographic algorithms currently used in blockchain networks. To address this, quantum-resistant encryption algorithms must be developed to enhance the security of blockchain systems.

The Intersection of Three Technologies: Building the Future Ecosystem

The convergence of artificial intelligence, blockchain, and quantum computers holds the potential to transform numerous industries with synergistic innovation:

1. Secure and Transparent AI Systems:

• Blockchain ensures the security of data used for training AI models.
• Quantum computers accelerate the development of faster and more intelligent systems.

2. Next-Generation Blockchain Networks:

• Quantum-based blockchain networks can be more secure and scalable than current systems.
• AI-powered smart contracts on blockchain enable more sophisticated business models.

3. Solutions to Global Challenges:

• These three technologies can provide impactful solutions to global problems such as climate change, energy optimization, and healthcare. For example, an AI-driven blockchain network for energy management could leverage the processing power of quantum computers.

Conclusion: Shaping the Future with a Technological Trinity

The convergence of artificial intelligence, blockchain, and quantum computers will elevate digital ecosystems to new levels of security, speed, and efficiency. However, for these technologies to work together seamlessly, continued research and development, along with ethical and regulatory frameworks, are essential.

This trinity will shape the future of technology, driving society toward a more sustainable, secure, and innovative world. The potential is immense it is now up to us to explore how to harness it to its fullest.

As artificial intelligence advances in the field of coding, future developers will need not only technical knowledge but also a creative mindset. This new generation of artist-programmers will not only write code but also bring projects to life with innovative ideas and artistic vision. As code goes beyond functionality, creativity and unique perspectives will become the real value in projects.

Who Is an Artist-Programmer?
Future developers, empowered by AI, will be able to break free from technical details and bring an artistic expression to digital projects. Coding will shift from being a routine task to becoming a tool for creative thought.

From Code to Ideas
With AI taking on technical workloads, creativity and vision will take center stage. Artist-programmers will blend their ideas with technology, transforming their projects into digital works of art. In this new world, generating innovative ideas with an artistic perspective will be as important as writing code.

Conclusion
Artist-programmers will use technology as a tool for artistic expression in the digital world of the future. With the support of AI, projects will acquire a more artistic identity, and the power of ideas will be valued more than ever.

Incorporating Artificial Intelligence (AI) into web applications has become easier with the availability of platforms like Hugging Face, which provides pre-trained models that can be easily integrated. In this project, I utilized PHP Laravel to build an image processing tool where users can upload images and perform AI-powered object detection.

The goal was to showcase how Laravel can seamlessly integrate with Hugging Face models to perform tasks like object detection. Let’s dive into the key implementation details and see how PHP can be combined with Hugging Face for powerful AI-based image processing.

Project Overview

The project allows users to upload images, analyze them using AI models from Hugging Face, and display the results, including object labels and bounding boxes.

Key Features:

• Upload Images: Users can upload any image via a web interface.
• Hugging Face API: Users can specify the Hugging Face model URL to perform object detection.
• Dynamic Analysis: The analysis results, including detected objects and labels, are displayed to the user.

Key Methods for Hugging Face API Integration

1. HuggingFaceService: Connecting to Hugging Face API

The HuggingFaceService is the core component that handles communication with Hugging Face. This service sends the uploaded image to the selected Hugging Face model and returns the analysis results.

• Image Conversion: The image is converted to base64 format before being sent to the API.
• API Request: The model URL and API key are used to make a POST request to Hugging Face, where the image is analyzed for object detection.
• Response: The method returns the API’s response, which includes detected objects and their bounding boxes.

2. ImageController: Managing Image Analysis

The controller (ImageController) handles the logic for uploading images and invoking the analysis through Hugging Face.

• Image Retrieval: Retrieves the uploaded image by its ID from the database.
• Model URL: Gets the Hugging Face model URL provided by the user.
• Calling the Service: Sends the image and model URL to HuggingFaceService for analysis.
• View Rendering: Passes the analysis results to the view, where the results are displayed.

3. Storing Uploaded Images

When users upload an image, it is saved to the server and then analyzed using Hugging Face models.

Explanation:

• Validation: Ensures that the uploaded file is a valid image.
• Saving the Image: Moves the uploaded image to the uploads directory and saves the filename in the database.
• Redirecting: After the image is uploaded, the user is redirected to the image list.

Why This Approach?

Using Hugging Face with PHP Laravel provides a flexible and scalable solution for integrating AI-based image analysis into web applications. Laravel’s robust backend and Hugging Face’s powerful AI models make this integration seamless, enabling developers to build feature-rich applications without the need for extensive AI expertise.

By focusing on service-oriented architecture, the project separates the business logic (image analysis) into the HuggingFaceService, making the code more modular and maintainable.

Conclusion

Integrating AI models into a PHP Laravel project is both powerful and efficient with the help of Hugging Face. The project demonstrates how easy it is to perform image analysis using pre-trained AI models by leveraging Laravel’s backend capabilities and Hugging Face’s APIs.

If you’re looking to add AI-based image processing to your own projects, the approach outlined here provides a solid foundation.

GitHub Repository

You can find the full source code for this project here:

GitHub — AI Image Processing with PHP Laravel and Hugging Face

Providing an interactive learning experience for visually impaired individuals opens up new opportunities in the digitalization of education. In this article, we will explore how the labeling functionality was developed in an educational platform designed for visually impaired children and how this functionality provides feedback through mobile application integration. The main technologies we focus on in this project are Canvas and the Fabric.js library.

Labeling Functionality with Fabric.js

The primary goal of the project is to allow users to select specific areas on educational materials and add labels to these areas. These labels are then explored by visually impaired individuals through mobile application integration, allowing them to receive audio feedback about these areas. This functionality is implemented on a Canvas structure created with the Fabric.js library.

Shape Selection and Drawing

Users can select areas they want to label on the Canvas. Various shapes, such as rectangles, circles, and triangles, can be selected and drawn by the user. These shapes are dynamically created using the Fabric.js library.

Code Explanation:

• shapeType Variable: The shapeType variable is set to rect (rectangle) based on the button clicked by the user.
• EventListener: The click event on the rectButton button is listened for and triggered.

With this code, the user can select a rectangular shape and draw an area on the Canvas to prepare it for labeling. The dimensions and position of this area are determined using Fabric.js and rendered on the Canvas.

When the user clicks and drags the mouse, the selected shape is dynamically created as follows:

• canvas.on('mouse:down', function(o)): This event listener triggers when the mouse is clicked on the Canvas. The event starts the drawing process when the user begins to draw a shape.
• canvas.getActiveObject(): This check ensures that no other shape is currently selected. If no shape is selected, a new shape can be drawn.
• isDown = true; This variable indicates the start of the mouse click, and the drawing process continues until the mouse is released.
• var pointer = canvas.getPointer(o.e); This line retrieves the x and y coordinates of the mouse click on the Canvas.
• origX and origY: These variables store the starting point of the mouse click.
• switch (shapeType): This structure determines which shape will be drawn based on the type of shape selected by the user.
• fabric.Rect, fabric.Circle, fabric.Triangle: These Fabric.js classes create rectangle, circle, and triangle shapes, respectively.
• left and top: These determine the starting point of the shape, which is the point where the mouse was clicked.
• width, height, radius: These determine the dimensions of the shape. Rectangles and triangles use width and height, while circles use radius.
• fill: This sets the color of the shape. In this example, the shapes are filled with a transparent blue color (rgba(0, 0, 255, 0.3)).
• transparentCorners: false: This ensures that the corners of the shape are not transparent, making the corner points more visible.
• canvas.add(currentShape); This line adds the created shape to the Canvas, allowing the user to see and interact with it visually.

This code block enables users to draw shapes on the Canvas using the mouse. The starting point, size, and type of the shape are dynamically determined by mouse clicks and drags, and the shape is instantly rendered on the Canvas. This functionality is used to define areas that visually impaired individuals can explore via a mobile application. These defined areas are supported by audio feedback, completing the labeling process.

Entering Label Information

After a shape is selected, the user can add a label to that shape. This process is performed through a modal window, where the label information is filled in based on the user’s input.

Code Explanation:

• labelValue: This variable holds the label information entered by the user.
• currentShape.set('label', labelValue): The label value entered by the user is added to the selected shape (currentShape).
• canvas.renderAll(): The Canvas is redrawn and updated.
• $('#labelModal').modal('hide'): The modal window is closed.

This process allows users to define specific areas in educational materials and add labels that provide information about these areas. These labels are then explored by visually impaired individuals via the mobile application, providing audio feedback.

Saving Data

Once the labeling process is complete, the selected areas and their associated label information need to be saved to the database. This is done by gathering data such as the coordinates, dimensions, shape type, and label information of the shapes and sending it to the server in JSON format.

Code Explanation:

• coordinates: This array contains the x and y coordinates, dimensions, label information, and shape type for each shape.
• $.ajax: This function sends the data to the server in JSON format.
• url: This specifies the server route where the labels will be saved.

This ensures that the labeled areas are securely saved in the database. The mobile application then uses this data to provide tactile feedback and audio descriptions to visually impaired individuals.

Conclusion

The labeling functionality developed using Canvas and Fabric.js is designed to enhance the accessibility of educational materials for visually impaired individuals. Through mobile application integration, visually impaired children can explore the labeled areas by touch and receive audio feedback about these areas. This functionality makes educational materials more meaningful and accessible while enriching the learning process.

Such innovative technologies are paving the way for a new era in education, creating more inclusive learning environments for individuals with special needs. The project stands out as a significant step towards making education more effective and accessible.

In modern web development, various technologies and libraries are employed to provide users with interactive and rich experiences. In our educational platform, we enhanced the interactive learning experience for visually impaired children by embedding QR codes into page images. To process these page images and successfully integrate the QR codes, we used the Intervention Image v3 library. In this article, we will dive into the technical details and coding steps of this integration process.

1. Project Structure and Technologies Used

This educational platform is built on the Laravel framework, following the MVC (Model-View-Controller) structure. The Intervention Image v3 library was used to embed QR codes into page images. This library is ideal for performing image processing tasks in PHP in a simple and flexible manner.

• Laravel 8: A modern PHP framework, Laravel provides the foundational structure of the project with its MVC architecture.
• Intervention Image v3: A powerful image processing library for PHP, capable of handling tasks like cropping, resizing, and merging images quickly and effectively.

2. QR Code Integration Process: Coding Details

The process of embedding a QR code into a page image involves several steps. This process starts with validating the data received from the user, followed by processing the image and finally integrating the QR code into the image.

Step 1: Validating User Input

In the first step, the image and QR code files uploaded by the user are checked to ensure they meet certain criteria. Laravel’s built-in validation mechanism is used to verify parameters such as file format and size.

• $request->validate([...]): Validates whether the file uploaded by the user meets specific criteria.
• 'qr_image' => 'required|image|mimes:jpeg,png,jpg,gif|max:2048': Specifies that the QR code file must be an image in certain formats and within a maximum size limit.
• 'qr_image.max' => 'The uploaded file size must not exceed 2MB.': Defines the error message to be shown if the file size exceeds 2MB.

This validation ensures that the file uploaded by the user is of an acceptable format and size. The mimes parameter ensures that only certain image formats are accepted, rejecting files outside of commonly used formats like JPEG and PNG.

Step 2: Memory Management and Image Processing

Image processing tasks, especially with large files, can consume significant memory. To accommodate this, we temporarily increase the memory limit.

• ini_set('memory_limit', '4M');: Temporarily increases the server's memory limit to 4MB.

In this step, server-side memory management is optimized to ensure that the image processing tasks are successfully completed.

Step 3: Reading and Processing the Image

At this stage, the Intervention Image v3 library comes into play. The page image and QR code uploaded by the user are read by Intervention Image, and various operations are performed on these images.

• $manager = new ImageManager(new Driver());: Creates a new instance of ImageManager for the Intervention Image library.
• $pageImage = $manager->read($pageImagePath);: Reads the page image from the specified file path.
• $qrCode = $manager->read($qrImage->getPathname());: Reads the QR code from the temporary file path where it was uploaded.

The key here is to correctly read the image files using the $pageImagePath and $qrImage->getPathname() parameters. $pageImagePath is the path where the page image is stored on the server, and $qrImage->getPathname() refers to the temporary storage path of the QR code uploaded by the user.

Step 4: Resizing the QR Code

To appropriately position the QR code on the page, it needs to be resized. This ensures both the aesthetic quality of the image and the scannability of the QR code.

• $qrCode->resize(400, 400);: Resizes the QR code to 400x400 pixels.

Here, the resize method scales the QR code to 400x400 pixels. This resizing ensures that the QR code fits well within the overall page image, allowing it to be scanned smoothly.

Step 5: Placing the QR Code on the Page Image

Now we are ready to place the QR code on the page image. This is done using the place method. The QR code is positioned in the top-left corner of the page image with a 50x50 pixel offset.

• $pageImage->place($qrCode, 'top-left', 50, 50);: Places the QR code on the top-left corner of the page image, offset by 50x50 pixels.

In this step, the place method positions the QR code at a specific location on the page image. The top-left parameter specifies that the QR code should be placed in the top-left corner of the image, while the 50, 50 parameters define the offset from this corner.

Step 6: Saving the Updated Image

After successfully embedding the QR code into the page image, the updated image file needs to be saved. This ensures that the final version of the page image presented to the user includes the QR code.

• $pageImage->save($pageImagePath);: Saves the updated page image to the specified file path.

The save method overwrites the original page image, saving the new version with the embedded QR code. This step ensures that the image shown to the end user includes the QR code.

Step 7: Providing User Feedback and Redirection

Finally, after the process is successfully completed, the user is given feedback and redirected to the next step. In this example, the user is redirected to a screen where they can add tags to the page image.

• return redirect()->route('pages.add_tags', ['page' => $page->page_id]): Redirects the user to the screen for adding tags to the page.
• ->with('success', 'Page successfully created and QR code added.');: Sends a success message to the user indicating that the operation was completed successfully.

Here, the redirect function guides the user to the next step, which is the tag-adding screen. Additionally, the with method provides the user with a success message confirming that the operation was completed successfully.

Technical Observations and Considerations

• Image Processing Performance: Ensuring sufficient memory during image processing is crucial. The Intervention Image library allows you to optimize memory usage when working with large image files.
• Correct Positioning: Proper placement of the QR code on the image is critical for both aesthetics and functionality. The Intervention Image library facilitates such placement operations.
• High-Quality Output: The scannability of QR codes depends on the accuracy of resizing and positioning operations. Intervention Image provides high-quality output to ensure these operations are successful.

Conclusion

The integration of QR codes into page images was a significant step in improving the user experience. The Intervention Image v3 library provided the flexibility and powerful features needed to seamlessly integrate QR codes. This technical solution added value to the project while enhancing the accessibility of educational materials for visually impaired children, supporting their interactive learning processes.

Such technical solutions are of great importance, especially in projects requiring accessibility. Thanks to powerful libraries like Intervention Image, even challenging integrations can be implemented quickly and effectively.